Update field value based on another field changed inline.

Update field value based on another field changed inline.

bbrindzabbrindza Posts: 299Questions: 68Answers: 1

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( '');
} );

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    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

  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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.

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

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

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

    !

    Allan

  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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?

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

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

    Allan

  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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'} );
    
      });
    
  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    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

  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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;
        } );
    } );
    
  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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.

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    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

  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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 .

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin
    Answer ✓

    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

  • bbrindzabbrindza Posts: 299Questions: 68Answers: 1

    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.

This discussion has been closed.