Update field value based on another field changed inline.

bbrindza

I need to reset fields values based on a value changed in another inline field . I tried using the following script, however when the table is loaded the first time, the code is executed and wipes out the values in said fields. I just need to perform this operation when a user changes the HRWPER. So let's say, if the percent field changed from 2.0 to 3.0, I need to reset other fields.

I am sure there is a better way to do this so all suggestions are welcomed.

$( editor.field( 'HRWPER' ).input() ).on( 'change', function () {

      //**Reset Plant Manager Approval function
      editor.field( 'HRWMGR' ).val( 0);
      editor.field( 'HRWMNA' ).val( '');
} );

allan

You need to check if the change event was triggered by the end user or by Editor (i.e. when the edit it triggered, it has to set the value, which involves a change). You can do that using the second parameter that is passed into the event handler:

$( editor.field( 'HRWPER' ).input() ).on( 'change', function (e, d) {
   if ( ! d && ! d.editor ) {
      //**Reset Plant Manager Approval function
      editor.field( 'HRWMGR' ).val( 0);
      editor.field( 'HRWMNA' ).val( '');
  }
} );

Allan

bbrindza

Gave that a try and received this error..

Cannot read property 'editor' of undefined.

It does not like the "d.editor" in the if statement.

allan

Sorry if ( ! d && ! d.editor ) { should have been:

if ( ! d || ! d.editor ) {

!

Allan

bbrindza

Allan,

I changed the if statement and the error is gone, however the function is not behaving they way I intended inline. When editing the HRWPER inline, the HRWMGR and HRWMNA fields that I need reset are not being submit to the DB, only the changed HRWPER is submit.

However, the function works fine in the editor form, the fields reset and when I click the update button it of course submits changes to the DB .

What am I missing?

allan

Are you using the allIfChanged value for the submit option of the form-options object that we've discussed before?

Allan

bbrindza

Yes, unless I have to add this elsewhere?

// Activate an inline edit on click of a table cell
  $('#approvalTable').on( 'click', 'tbody td:not(:first-child):not(\'.live\')', function (e) {
                editor.inline( this , {onBlur: 'submit',
                                      submit: 'allIfChanged'} );

  });

allan

No - that should be all you need if that is the only place that you trigger inline editing. That should submit all of the fields in the form whenever the value of a single field changes. Can you link to the page so I can take a look please?

Allan

bbrindza

Allan,

I found the culprit. It is the following code. Not sure why it is messing with the inline submit However if I comment this out it, works for inline editing of the HRWPER field.

// Field validation function
  editor.on( 'preSubmit', function ( e, d ) {
        var increasePercent = this.field( 'HRWPER');
     
        
        if ( increasePercent.val() === '' ) {
             increasePercent.error( 'Increase Percent Must Be Numeric' );
            return false;
        }
     
        return true;
    } );
} );

bbrindza

Not so fast , The last post referencing my Field validation function was causing a problems for my ->on( 'preEdit', function. I am still experiencing the issue with my editor.field change function. The JS is getting into the function when the HRWPER change, however the submit is not fired to change values in DB fields.

allan

Just to recap (I'm get a little lost - sorry!):

I am still experiencing the issue with my editor.field change function.

That is this, right?

$( editor.field( 'HRWPER' ).input() ).on( 'change', function (e, d) {
   if ( ! d || ! d.editor ) {
      //**Reset Plant Manager Approval function
      editor.field( 'HRWMGR' ).val( 0);
      editor.field( 'HRWMNA' ).val( '');
  }
} );

Then when you submit the form, are you saying that HRWPER is included in the submission, but HRWMGR and HRWMNA are not?

Can you check the data being submitted to the server in the network panel of your browser please?

Sorry about the delay replying to your e-mails - I will do so later today.

Allan

bbrindza

I am sorry Allan I was juggle 2 things . Yes this is still an issue.

$( editor.field( 'HRWPER' ).input() ).on( 'change', function (e, d) {
      if ( ! d || ! d.editor ) {
 
          //**Reset Plant Manager Approval function
          editor.field( 'HRWMGR' ).val( 0);
          editor.field( 'HRWMNA' ).val( '');
    } );

My file_put_contents( '/tmp/a', json_encode( $values )."\n", FILE_APPEND ); contains..

"HRWMGR":"54319",
"HRWMNA":"Jose Cuervo",

Based on my JS script the should be

"HRWMGR":"0",
"HRWMNA":"",

I will wait on your email reply .

allan

If you add a console.log into that code (between lines 1 and 2, and another one on line 3) does that code actually execute?

Allan

bbrindza

Updated and answered. Allan pointed out that the

  $( editor.field( 'HRWPER' ).input() ).on( 'change', function (e, d)

should be using the 'keydown' event instead of the 'change'

 $( editor.field( 'HRWPER' ).input() ).on( 'keydown', function (e)

Refer to https://www.quirksmode.org/dom/events/keys.html for more insight.