Edit Button in Detailed View

If you're a new user of AppGini, feel free to ask general usage questions, or look for answers here.
Post Reply
uchhavi
Veteran Member
Posts: 80
Joined: 2018-05-15 14:07

Edit Button in Detailed View

Post by uchhavi » 2018-05-16 09:56

Hello,
By default in the table detailed view all the fields are editable. So it is possible that the user by mistake edits the field without realizing it.

Is it possible to make all entry fields in the table uneditable and a person can only be able to edit, when he clicks on the edit button.

Please can anyone help me with the code?

Thanks and look forward.

Best regards,

Chhavi
Best regards,

Chhavi Jain

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Edit Button in Detailed View

Post by pbottcher » 2018-05-16 12:04

Hi,

you can add something like this code to your hooks/footer-extras.php

Code: Select all

<script>
		$j('[id$=dv_action_buttons] .btn-toolbar').append(
			'<div class="btn-group-vertical btn-group-lg" style="width: 100%;">' +
				'<button type="button" class="btn btn-default btn-lg" onclick="$j(\'[id$=_dv_form] :input\').attr(\'readonly\', false);">' +
				'<i class="glyphicon glyphicon-edit"></i> Enable Edit</button>' +
			'</div>'
		);
		
		$j('[id$=_dv_form] :input').attr('readonly', true);
</script>
This will make all input fields read only and add a button to make the writeable.

Hope that helps
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

uchhavi
Veteran Member
Posts: 80
Joined: 2018-05-15 14:07

Re: Edit Button in Detailed View

Post by uchhavi » 2018-05-17 06:33

wow that worked... thanks...

only one issue the dropdowns and the data that I am calling from other tables is still enabled.
Is there some way of disabling that too?
Best regards,

Chhavi Jain

uchhavi
Veteran Member
Posts: 80
Joined: 2018-05-15 14:07

Re: Edit Button in Detailed View

Post by uchhavi » 2018-05-17 06:34

wow that worked... thanks...

only one issue the dropdowns and the data that I am calling from other tables is still enabled.
Is there some way of disabling that too?

Attached the screen for yr perusal
Attachments
screen so.PNG
screen so.PNG (166.1 KiB) Viewed 5291 times
Best regards,

Chhavi Jain

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Edit Button in Detailed View

Post by pbottcher » 2018-05-17 15:12

Hi,

ok, this is a little bit tricky. You can try this.

Code: Select all

		$j('[id$=dv_action_buttons] .btn-toolbar').append(
			'<div class="btn-group-vertical btn-group-lg" style="width: 100%;">' +
				'<button type="button" class="btn btn-default btn-lg" onclick="$j(\'[id$=_dv_form] :input\').attr(\'readonly\', false);$j(\'[id$=container]\').attr(\'disabled\', false);">' +
				'<i class="glyphicon glyphicon-edit"></i> Enable Edit</button>' +
			'</div>'
		);
		
		$j('[id$=_dv_form] :input').attr('readonly', true);
		
		function readyFn ( jquery ) {
			$x = $j('[id$=_dv_form]');
			$j('[id$=container]').prop('disabled', true);
			$j('[id$=container]').attr('disabled', true);	
		}
		jQuery(function() {
			setTimeout(function(){
				if(typeof(readyFn) == 'function') readyFn();
			}, 10); /* we need to slightly delay client-side execution of the above code to allow AppGini.ajaxCache to work */
		});
If you need it for radio buttons as well, you can add

Code: Select all

$j('[id$=_dv_form] input:radio').attr('disabled', true);
and

Code: Select all

$j('[id$=_dv_form] input:radio').attr('disabled', false);
in the button.
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

uchhavi
Veteran Member
Posts: 80
Joined: 2018-05-15 14:07

Re: Edit Button in Detailed View

Post by uchhavi » 2018-05-17 15:56

It worked... thank u soo much :)
Best regards,

Chhavi Jain

hherman
Posts: 2
Joined: 2018-04-23 23:04

Re: Edit Button in Detailed View

Post by hherman » 2018-05-20 08:29

Hi there,

i tested this mod, but on date field it's still editable any way to fix this?

thanks

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Edit Button in Detailed View

Post by pbottcher » 2018-05-20 09:22

You can use this instead

Code: Select all

		$j('[id$=dv_action_buttons] .btn-toolbar').append(
			'<div class="btn-group-vertical btn-group-lg" style="width: 100%;">' +
				'<button type="button" class="btn btn-default btn-lg" onclick="$j(\'[id$=_dv_form] :input\').attr(\'disabled\', false);$j(\'[id$=container]\').attr(\'disabled\', false);">' +
				'<i class="glyphicon glyphicon-edit"></i> Enable Edit</button>' +
			'</div>'
		);
		
		$j('[id$=_dv_form] :input').attr('disabled', true);
		
		function readyFn ( jquery ) {
			$x = $j('[id$=_dv_form]');
			$j('[id$=container]').prop('disabled', true);
			$j('[id$=container]').attr('disabled', true);	
		}
		jQuery(function() {
			setTimeout(function(){
				if(typeof(readyFn) == 'function') readyFn();
			}, 10); /* we need to slightly delay client-side execution of the above code to allow AppGini.ajaxCache to work */
		});
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

zkarwinkar
Veteran Member
Posts: 32
Joined: 2021-06-12 21:01

Re: Edit Button in Detailed View

Post by zkarwinkar » 2021-07-01 04:53

that works great on all inputs and dropdown selection , but
1.rich HTML text area remains editable
2.when you click on enable edit button, lookup field remains disabled
V 5.97

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-04 15:40

Hi there,
I too would like to use this super script, works great :D . But even with me, the lockup fields cannot be edited with the edit button. Furthermore, two "edit buttons" are always displayed, see attachment, but only if Appgini Helper is set up on the table.
Can someone here give me a solution?
enable_button.JPG
enable_button.JPG (10.88 KiB) Viewed 2720 times

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-04 16:21

...I noticed that the "enable edit" button only doesn't work properly for tables where a tablename-dv.js was created in the hooks folder!
For all others, the script works wonderfully :)

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-05 08:52

...after I had added the following line to the script, the lockup fields could be edited again using the "enable edit button" :idea:

Code: Select all

$j(\'[id$=container]\').prop(\'disabled\', false);
Below is the complete script:

Code: Select all

 
$j('[id$=dv_action_buttons] .btn-toolbar').append(
	'<div class="btn-group-vertical btn-group-lg" style="width: 100%;">' +
		'<button type="button" class="btn btn-default btn-lg" onclick="$j(\'[id$=_dv_form] :input\').attr(\'disabled\', false);$j(\'[id$=container]\').attr(\'disabled\', false);$j(\'[id$=container]\').prop(\'disabled\', false);">' +
		'<i class="glyphicon glyphicon-edit"></i> Enable Edit</button>' +
	'</div>'
);
		
$j('[id$=_dv_form] :input').attr('disabled', true);
		
function readyFn ( jquery ) {
	$x = $j('[id$=_dv_form]');
	$j('[id$=container]').prop('disabled', true);
	$j('[id$=container]').attr('disabled', true);	
}
jQuery(function() {
	setTimeout(function(){
		if(typeof(readyFn) == 'function') readyFn();
	}, 10); /* we need to slightly delay client-side execution of the above code to allow AppGini.ajaxCache to work */
});
Now only the second "Enable Edit button" should go - any ideas :?:

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-05 10:15

...the solution for the double buttons was in the forum at: viewtopic.php?t=3683
Adding ":eq(0)" behind ".btn-toolbar" disables the second button.
Below is the complete code for footer-extras.php:

Code: Select all

<script>
	
		$j('[id$=dv_action_buttons] .btn-toolbar:eq(0)').append(
			'<div class="btn-group-vertical btn-group-lg" style="width: 100%;">' +
				'<button type="button" class="btn btn-default btn-lg" onclick="$j(\'[id$=_dv_form] :input\').attr(\'disabled\', false);$j(\'[id$=container]\').attr(\'disabled\', false);$j(\'[id$=container]\').prop(\'disabled\', false);">' +
				'<i class="glyphicon glyphicon-edit"></i> </button>' +
			'</div>'
		);
		
		$j('[id$=_dv_form] :input').attr('disabled', true);
		
		function readyFn ( jquery ) {
			$x = $j('[id$=_dv_form]');
			$j('[id$=container]').prop('disabled', true);
			$j('[id$=container]').attr('disabled', true);	
		}
		jQuery(function() {
			setTimeout(function(){
				if(typeof(readyFn) == 'function') readyFn();
			}, 10); /* we need to slightly delay client-side execution of the above code to allow AppGini.ajaxCache to work */
		});
	
</script>

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-05 13:27

...is it possible to use this script only for existing data sets. It should not be executed for new records.

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Edit Button in Detailed View

Post by jsetzer » 2022-03-05 14:52

You can evaluate value of SelectedID input field. If not set, the dv is in insert mode.
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-05 15:33

Hi jsetzer,
thank you for the feedback.
Can you tell me, how I integrate the evaluation into these script?

Kind regards,
Stefan

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Edit Button in Detailed View

Post by jsetzer » 2022-03-05 16:21

There are many posts here in the forum about getting the primary key in detail view.

Should be something like this:

Code: Select all

var pk = jQuery('input[name="SelectedID"]').val();
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-06 06:07

Thanks for the tip, I'll try to get it working :?

Kind regards,
Stefan

skoch
Veteran Member
Posts: 49
Joined: 2020-01-27 14:20

Re: Edit Button in Detailed View

Post by skoch » 2022-03-08 13:26

Hi there,
unfortunately I haven't gotten any further ... but now I have a new problem:
The above script does not deactivate any text fields defined as "HTML area".

The following script did not work:

Code: Select all

$j('[id$=_dv_form]  input:textarea').attr('disabled', true);
A text field set as a "text area" with no formatting option works.

Kind Regards
Stefan

Post Reply