CODEWITHSUNDEEP
jqueryhtmldomattr
J.BizMai
J.BizMai

Reputation: 2787

jQuery .attr() does not set in HTML after to set value and remove this attribute before

In my script, I need all the time on form items set attributes in HTML to save previous data and evaluate the next data before doing an ajax request.

Concerning data-next-* attributes, there are removed all the time after the script is done like this :

function actualizeTmpDataAndSpinner (){
       //Notice : "Value" is position value
       var a_dataValueKeys = [ "value", "is-condition", "condition-type", "condition-selector" ];

       for( var k=0 ; k < a_dataValueKeys.length; k++ ){
           $("*[data-previous-" + a_dataValueKeys[k] + "]").removeAttr( "data-previous-" + a_dataValueKeys[k] );
           $("*[data-next-" + a_dataValueKeys[k] + "]").each( function () {
           var dataNextValue = $(this).attr("data-next-" + a_dataValueKeys[k] );
           $(this).attr("data-" + a_dataValueKeys[k], dataNextValue );
       });
       $("*[data-next-" + a_dataValueKeys[k] + "]").removeAttr("data-next-" + a_dataValueKeys[k] );
   }
   $(".h4a-spinner-wrapper").remove();
}

For some reasons, after data-next-* was setup with values and removed, at a moment this following code line set attributes only in the DOM, and not in the HTML anymore :

function resetConditionForNext( $currentfieldConditionWrapper ) {
    $currentfieldConditionWrapper.attr('data-next-is-condition', "false" );
    $currentfieldConditionWrapper.attr('data-next-condition-type', "" );
    $currentfieldConditionWrapper.attr('data-next-condition-selector', "" );
}

Output

In console enter image description here

HTML Inspector enter image description here

Why data-next-is-condition, data-next-condition-type and data-next-condition-selector are not visible in the HTML inspector ?

Someone has got an explanation ?

Upvotes: 0

Views: 285

Answers (1)

J.BizMai
J.BizMai

Reputation: 2787

I found what happened...

As the script removes data-next-* at the end, in order to check new attributes, I tried to use alert("stop"); like this :

if( !$conditionCheckbox.is(":checked") ){
    resetConditionForNext( $currentConditionWrapper );
    console.dir( $currentConditionWrapper );
    alert("stop");
    break;
}

But alert("stop"); is run before doing the change in HTML Inspector.

If I write an unknown javascript word like exit; instead of alert("stop"); like this :

if( !$conditionCheckbox.is(":checked") ){
    resetConditionForNext( $currentConditionWrapper );
    console.dir( $currentConditionWrapper );
    exit;
    break;
}

The script is locked and the HTML Inspector is updated :

enter image description here

Upvotes: 1

Related Questions