javascript - Avoid looping once click the a tag -
i trying figure out how avoid looping in javascript. have code:
$.ajax({ url : '<?php echo base_url()?>project/search_project_structure_stage', type: 'post', data: { project_id: $('#project_id').val() }, success : function(stages) { var stages = $.parsejson(stages); (var = 0; < stages.length; i++) { stageid = stages[i].id; stagename = stages[i].stagename; stageorder = stages[i].ordstage; stagetypecode = stages[i].stagecode; projectid = stages[i].pid var html_stage = "<div class='row col-sm-10'><ol id='"+stageid+"' class='group_stage'>" + "<li style='list-style:none' class='container span1'>" + "<a class='expand_batch'><i class='fa fa-folder'></i> " + stagename + " [" + stagetypecode + "] (" + stageorder + ")</a>" + "<a class='icon_edit_stage' id='"+stageid+"'>" + "<i class='fa fa-pencil fa-fw icon'></i>" + "</a>" + "<a class='scopy' sid='"+stageid+"' pid='"+projectid+"'>" + "<i class='fa fa-copy fa-fw icon'></i>" + "</a>"; $('#stage').append(html_stage); $.ajax({ url : '<?php echo base_url()?>project/search_project_structure_batch', type: 'post', data: { 'stage_id': stageid, }, success : function(batch) { var batch = $.parsejson(batch); (var = 0; < batch.length; i++) { batchid = batch[i].batchid; batchname = batch[i].batchname; batchorder= batch[i].ordbatch; stageid = batch[i].stageid; projectid = batch[i].project_id; var html_batch = "<ol id='"+batchid+"' class='group_batch batch'>" + "<li style='list-style:none' class='container span2'>" + "<a class='expand_activity'>" + "<i class='fa fa-list'></i> " + batchname + " (" + batchorder + ")</a>" + "<a class='icon_edit_batch' id='"+batchid+"'>" + "<i class='fa fa-edit fa-fw icon'></i>" + "</a>" + "<a class='bcopy' bid='"+batchid+"' sid='"+stageid+"' pid='"+projectid+"' data-toggle='modal'>" + "<i class='fa fa-copy fa-fw icon'></i>" + "</a>"; $('#'+stageid).append(html_batch); } $( ".bcopy" ).click(function() { batch_id = $(this).attr('bid'); stage_id = $(this).attr('sid'); batch_project_id = $(this).attr('pid'); $('#batch_id').val(batch_id); $('#batch_stage_id').val(stage_id); $('#batch_project_id').val(batch_project_id); $('#mymodalclonebatch').modal('show'); $( "#clone_batch" ).click(function() { $.ajax({ url : '<?php echo base_url('project/clone_batch')?>', type: 'post', data: { batch_id : $('#batch_id').val(), batch_stage_id : $('#batch_stage_id').val(), batch_project_id : $('#batch_project_id').val(), batch_name : $('#batch_name').val(), batch_quantity : $('#batch_quantity').val() }, success: function(msg) { } }); }); }); } }); } $( ".scopy" ).click(function() { stage_id = $(this).attr('sid'); stage_project_id = $(this).attr('pid'); $('#stage_id').append(stage_id); $('#stage_project_id').append(stage_project_id); $('#mymodalclonestage').modal('show'); $( "#clone_stage" ).click(function() { $('#mymodalclonestage').modal('hide'); document.getelementbyid('toggle-div').style.display='block'; var target = document.getelementbyid('wrapper'); var spinner = new spinner(opts).spin(target); $.ajax({ url : '<?php echo base_url('project/clone_stage')?>', type: 'post', data: { stage_id : $('#stage_id').text(), stage_project_id : $('#stage_project_id').text(), stage_name : $('#stage_name').val(), stage_code : $('#stage_code').val() }, success: function(msg) { document.getelementbyid('toggle-div').style.display='none'; spinner.stop(); var msg = $.parsejson(msg); jo_number = $('#jo_number').val(); $('#cloned_jo_number').append(jo_number); $('#mymodalclonestagesuccess').modal('show'); } }); }); }); } });
as notice $( ".bcopy" ).click(function()
inside for
loop. want ask how avoid once click <a> tag
class bcopy
. not follow for loop
?
it happens when click <a> tag
loop.
put out side loop rendering click event script multiple time , element added after dom loaded need use delegated event make work:
$("#stage").on('click','.bcopy',function() { // code goes here });
you can read more in detail here
Comments
Post a Comment