javascript - Using call on a jquery function for multiple elements -


i have following code is, inserts after div specific id attribute when clicked on button. , increments counter used specify div inserted after.

it works, want know is? how can change code around, can create object properties , create method can used insert after, lastly call specific jquery elements , job gets done.

the reason enquiry want use method on other objects follows same principles has different object properties, can use single method call different objects different properties , make call insert after different divs.

$(document).ready(function() {  counter = 0; $("#addmeasurement").on("click", function() {++counter;     //create variables insert after     var container = '<div id="measurement_container' + counter + '" class="col-12 object">'     var icon = '<span id="measurement_icon' + counter + '" class="flaticon-glass-of-water-with-drop" title="measurement"></span>';     var info_span = '<span id="measurement_info' + counter + '" class="">';     var info_mt = '<input class="totop" type="text" name="measurementtype' + counter + '" id="measurementtype' + counter + '" placeholder="measurement" size="10">';     var info_ma = '<input class="totop" style="margin-left:90px;" type="text" name="measurementabbr' + counter + '" id="measurementabbr' + counter + '" placeholder="abbr" size="3">';     var info_mti = '<input class="totop" style="margin-top:25px;" type="text" name="measurementtitle' + counter + '" id="measurementtitle' + counter + '" placeholder="name" size="10"> ';     var info_md = '<input class="totop"  style="margin-top:25px; margin-left:90px; width:3.5em;" type="number" name="measurementdescimalplaces' + counter + '" id="measurementdescimalplaces' + counter + '" min="0" max="4" title="descimal points" placeholder=".dp">';      $(container + icon + info_span + info_mt + info_ma + info_mti + info_md + '</span>' + '</div>').insertafter("#measurement_container" + (-1 + counter));  }); });

i want have (i omitted of properties in object easier readability).

$(document).ready(function(){ var counter = 0;  var measurement_object = { container : '<div id="measurement_container' + counter + '"   class="col-12 object">',     icon: '<span id="measurement_icon' + counter + '" class="flaticon-glass-  of-water-with-drop" title="measurement"></span>' }  function duplicate_object(el){ $(this).insertafter(el); }  $("#addmeasurement").on("click", function(){ duplicate_object.call(duplicate_object,"#measurement_container0"); }); });

honestly if you're inserting html js, i'd take step , consider other options. it's code smell means you're approaching in wrong manner.

that being said, there's no need create factory function simple. here's core functionality of function. i'm abbreviating building of element sake of time:

$(document).ready(function() {    var count = 0;        $('#addmeasurement').on('click', function() {      var div = document.createelement('div');            // should class, since you're using more once.      $(div).insertafter('#measurement_container');            count++;    });        $('.other-element').on('click', function() {      console.log(count); // outputs # of elements added    });  });

describe want on page, , can little more.


Comments

Post a Comment

Popular posts from this blog

jOOQ update returning clause with Oracle -

according http://www.jooq.org/doc/3.8/manual/sql-building/sql-statements/update-statement/ jooq doesn't support returning clause in update statements databases except firebird , postgres. does know, still correct oracle jooq? according oracle's documentation, oracle db supports returning clase delete, insert, or update statements. incorrect manual you're right - manual wrong , should fixed: https://github.com/jooq/jooq/issues/5470 single row update returning jooq 3.8 added support single row update .. returning statements. internally, uses callablestatement , pl/sql block of form: begin update "my_table" set "my_table"."column" = 'xyz' "my_table"."id" = 1 returning "my_table"."id", "my_table"."column" ?, ?; ? := sql%rowcount; end; the relevant issue is: https://github.com/jooq/jooq/issues/5190 multi row update returning a...
Read more

java - Warning equals/hashCode on @Data annotation lombok with inheritance -

i have entity inherits other. on other hand, i'm using lombok project reduce boilerplate code, put @data annotation. annotation @data inheritance produces next warning: generating equals/hashcode implementation without call superclass, though class not extend java.lang.object. if intentional, add '@equalsandhashcode(callsuper=false)' type. is advisable add annotation @equalsandhashcode (callsuper = true) or @equalsandhashcode (callsuper = false) ? if not added, 1 callsuper=false or callsuper=true ? the default value false . 1 if don't specify , ignore warning. yes, recommended add @equalsandhashcode annotation on @data annotated classes extend else object. cannot tell if need true or false , depends on class hierarchy, , need examined on case-by-case basis. however, project or package, can configure in lombok.config call super methods if not direct subclass of object. lombok.equalsandhashcode.callsuper = call for configuration system ...
Read more

java - BasicPathUsageException: Cannot join to attribute of basic type -

i using java 8 jpa (hibernate 5.2.1). have clause works perfectly, until introduce clause make use foreign key table values too. i getting following error: basicpathusageexception: cannot join attribute of basic type i think problem related fact have join table, , not sure how create join using join table. employee - employee_category - category model (employee.java): @manytomany(cascade = cascadetype.all, fetch=fetchtype.eager) @jointable ( name="employee_category", joincolumns={ @joincolumn(name="emp_id", referencedcolumnname="id") }, inversejoincolumns={ @joincolumn(name="cat_id", referencedcolumnname="id") } ) private set<category> categories; model (category.java): @id private string id; jpa when introduce following code, fails error above (i think problem new piece of code): join<t, category> category = from.join("id"); predicates.add(criteriabuilder.like(category....
Read more