2016-03-19 17 views
0

bu benim html kodu, ben Add More butonuna tıkladığınızda ardından name=data[Productpricemaster][30][attributeunitids] ve name=data[Productpricemaster][31][attributeunitids]jQuery ekleme mullti selectbox farklı bir isimle

<div class="topdivdata"> 
 
    <div style="width:100px; float:left;border:1px solid"> 
 
    <select id="2" name="data[Productpricemaster][1][attributeunitids]" class="col-xs-10 col-sm-10 selectedvalue"> 
 
     <option value="0">None</option> 
 
     <option value="4">KG</option> 
 
     <option value="5">MG </option> 
 
     <option value="6">GM </option> 
 
    </select> 
 
    </div> 
 
    <div style="width:100px; float:left;border:1px solid"> 
 
    <select id="3" name="data[Productpricemaster][11][attributeunitids]" class="col-xs-10 col-sm-10 selectedvalue" > 
 
     <option value="0">None</option> 
 
     <option value="7">Red </option> 
 
     <option value="8">Green </option> 
 
     <option value="9">Blue </option> 
 
     <option value="10">Yellow </option> 
 
    </select> 
 
    </div> 
 
    <div style="clear:both; "></div> 
 
</div> 
 
<div id="addnewunit"style="width:100px; float:left;border:1px solid"> <span class="btn btn-xs cic"> <i class="icon-plus"> </i>+ Add More </span> </div> 
 
<div id="addmoreunit" style="margin-top:30px"> </div> 
 
<script src="http://code.jquery.com/jquery-1.12.2.js" type="text/jscript"></script> 
 
<script> 
 
unitcount=1; 
 
$('#addnewunit').click(function() 
 
\t \t \t { 
 
\t \t \t var topdiv = $('.topdivdata').html(); \t 
 
$('#addmoreunit').append('<div>.'+topdiv+'.<div class="removes1"><span class="btn btn-xs"><i class="icon-plus"></i>- Remove</span></div></div>'); \t 
 
\t 
 
\t unitcount++; 
 
\t    var value = $('.target').val(); 
 
\t \t \t \t $('.list').val(value); 
 
\t \t \t \t $('.removes1').click(function() 
 
\t \t \t \t \t { 
 
\t \t \t \t \t \t $(this).parent().remove(); 
 
\t \t \t \t \t }); 
 
\t \t \t }); 
 
</script>

+0

mı? – DMishra

cevap

0

. snipped

$($('#addmoreunit').children().last().find('select')[0]).attr('id', (unitcount + 1)).attr('name', 'data[Productpricemaster][' + (unitcount + 1) + '][attributeunitids]'); 
$($('#addmoreunit').children().last().find('select')[1]).attr('id', (unitcount + 2)).attr('name', 'data[Productpricemaster][' + (unitcount + 2) + '][attributeunitids]'); 

Final Kod sana kod dinamik kimliği dışında iyi çalışıyor düşünüyorum

<div class="topdivdata"> 
    <div style="width: 100px; float: left; border: 1px solid"> 
     <select id="1" name="data[Productpricemaster][1][attributeunitids]" class="col-xs-10 col-sm-10 selectedvalue"> 
      <option value="0">None</option> 
      <option value="4">KG</option> 
      <option value="5">MG </option> 
      <option value="6">GM </option> 
     </select> 
    </div> 
    <div style="width: 100px; float: left; border: 1px solid"> 
     <select id="2" name="data[Productpricemaster][2][attributeunitids]" class="col-xs-10 col-sm-10 selectedvalue"> 
      <option value="0">None</option> 
      <option value="7">Red </option> 
      <option value="8">Green </option> 
      <option value="9">Blue </option> 
      <option value="10">Yellow </option> 
     </select> 
    </div> 
    <div style="clear: both;"> 
    </div> 
</div> 
<div id="addnewunit" style="width: 100px; float: left; border: 1px solid"> 
    <span class="btn btn-xs cic"><i class="icon-plus"></i>+ Add More </span> 
</div> 
<div id="addmoreunit" style="margin-top: 30px"> 
</div> 
<script> 
    unitcount = 2; 
    $('#addnewunit').click(function() { 
     var topdiv = $('.topdivdata').html(); 
     $('#addmoreunit').append('<div>.' + topdiv + '.<div class="removes1"><span class="btn btn-xs"><i class="icon-plus"></i>- Remove</span></div></div>'); 
     $($('#addmoreunit').children().last().find('select')[0]).attr('id', (unitcount + 1)).attr('name', 'data[Productpricemaster][' + (unitcount + 1) + '][attributeunitids]'); 
     $($('#addmoreunit').children().last().find('select')[1]).attr('id', (unitcount + 2)).attr('name', 'data[Productpricemaster][' + (unitcount + 2) + '][attributeunitids]'); 
     unitcount = unitcount + 2; 
     var value = $('.target').val(); 
     $('.list').val(value); 
     $('.removes1').click(function() { 
      $(this).parent().remove(); 
     }); 
    }); 
</script> 
+0

Teşekkürler arkadaş bir şey daha fazla kutu miktarı sabit değil toplam 2, 3 ya da 4 yani nasıl yapabiliriz? –

+0

Set unitcount = bir satırda toplam seçim; ve birim sayısı = birim sayısı + bir satırda toplam seçim; – DMishra

+0

sevgili arkadaş topdiv = topdiv.replace ("name = \" veri [Productpricemaster] [1] [attributeunitids] \ "", "name = \" data [Productpricemaster] [30] [attributeunitids] \ ""), verilerde [Productpricemaster] [1] [attributeunitids] değeri [1] sabit değildir, toplamı 4,5,7,9 olur, bu yüzden nasıl ismini değiştirebiliriz, nasıl kurtulabileceğimizi [1] ve her şeyi tekrar başlatabiliriz –

0
gibi farklı bir isimle div basıp kutusunu eklemek bunu istiyorum

Bu satırdan sonra bu satırı ekleyin

topdiv = topdiv.replace("name=\"data[Productpricemaster][1][attributeunitids]\"", "name=\"data[Productpricemaster][30][attributeunitids]\"") 
topdiv = topdiv.replace("name=\"data[Productpricemaster][11][attributeunitids]\"", "name=\"data[Productpricemaster][31][attributeunitids]\"") 

İstediğiniz herhangi bir dizeyle değiştirebilirsiniz.

<div class="topdivdata"> 
 
    <div style="width:100px; float:left;border:1px solid"> 
 
    <select id="2" name="data[Productpricemaster][1][attributeunitids]" class="col-xs-10 col-sm-10 selectedvalue"> 
 
     <option value="0">None</option> 
 
     <option value="4">KG</option> 
 
     <option value="5">MG </option> 
 
     <option value="6">GM </option> 
 
    </select> 
 
    </div> 
 
    <div style="width:100px; float:left;border:1px solid"> 
 
    <select id="3" name="data[Productpricemaster][11][attributeunitids]" class="col-xs-10 col-sm-10 selectedvalue" > 
 
     <option value="0">None</option> 
 
     <option value="7">Red </option> 
 
     <option value="8">Green </option> 
 
     <option value="9">Blue </option> 
 
     <option value="10">Yellow </option> 
 
    </select> 
 
    </div> 
 
    <div style="clear:both; "></div> 
 
</div> 
 
<div id="addnewunit"style="width:100px; float:left;border:1px solid"> <span class="btn btn-xs cic"> <i class="icon-plus"> </i>+ Add More </span> </div> 
 
<div id="addmoreunit" style="margin-top:30px"> </div> 
 
<script src="http://code.jquery.com/jquery-1.12.2.js" type="text/jscript"></script> 
 
<script> 
 
unitcount=1; 
 
$('#addnewunit').click(function() 
 
\t \t \t { 
 
\t \t \t var topdiv = $('.topdivdata').html(); 
 
topdiv = topdiv.replace("name=\"data[Productpricemaster][1][attributeunitids]\"", "name=\"data[Productpricemaster][30][attributeunitids]\"") 
 
topdiv = topdiv.replace("name=\"data[Productpricemaster][11][attributeunitids]\"", "name=\"data[Productpricemaster][31][attributeunitids]\"") 
 

 

 
$('#addmoreunit').append('<div>.'+topdiv+'.<div class="removes1"><span class="btn btn-xs"><i class="icon-plus"></i>- Remove</span></div></div>'); \t 
 
\t 
 
\t unitcount++; 
 
\t    var value = $('.target').val(); 
 
\t \t \t \t $('.list').val(value); 
 
\t \t \t \t $('.removes1').click(function() 
 
\t \t \t \t \t { 
 
\t \t \t \t \t \t $(this).parent().remove(); 
 
\t \t \t \t \t }); 
 
\t \t \t }); 
 
</script>
Ben darbeyi dinamik kimliği ve adı nitelik seçmek için tanıtacak iki satır ilave etmişti

İlgili konular