jquery - attach event to child elements, code improvements and better maintenability -


i have form, identify attribute form[data-role="party-form"].

i need attach logic n elements [data-role="element1...n"] , i've done way:

$('form[data-role="party-form"] [data-role="element1"]').change(function(e){        var el = $(e.target);        var form = el.parents('form[data-role="party-form"]');        // custom logic element 1 accessing other form elements }  // ...  $('form[data-role="party-form"] [data-role="elementn"]').change(function(e){        var el = $(e.target);        var form = el.parents('form[data-role="party-form"]');        // custom logic element n accessing other form elements } 

i don't code lot, there lots of repetition (parent selector , logic parent form)

i thinking refactoring "onchange" listener "input" elements of form (and switch on clicked element), or more object-oriented approach, - before continue - has in mind better way implement ? thanks

using jquery attribute ^ selector,it match element attribute start width something:

$('form[data-role="party-form"] [data-role^="element"]').change(function(e){        var el = $(e.target);        var form = el.parents('form[data-role="party-form"]');        var index = form.attr("data-role").replace("element","");        // custom logic element [index]  } 

Comments

Popular posts from this blog

php - mySql Join with 4 tables -

css - Text drops down with smaller window -

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -