开发者

how to push text values to their parent and siblings div. using jquery

I need to select all values from following input fields to their res开发者_C百科pective divs.. see bellow

<div id='table_row_div'>
  <div id='txtbox'><input type=text name='from' value='<?php echo $someVal?>'></div>
  <div id='splited'>
    <div new="0"><div>i want text's splited value here</div>
    <div new="1"><div>i want text's splited value here</div>
    <div new="2"><div>i want text's splited value here</div>
  </div>
</div>

These input text fileds contains (1,0,0), (0,1,1), (1,0,1) type values... The above block is about 49 times... and i want an automated system that splits the text value, and push only "one" character on each next div of attr(new);

how can i do this using jquery. i tried following type of code..

var inputVal = $("#table_row_div #txtbox input");
var arrayFromDB = inputVal.val().split(',');


inputVal.closest('div').closest('div').find('div[new~="0"]').text(arrayFromDB[0]);
inputVal.closest('div').closest('div').find('div[new~="1"]').text(arrayFromDB[1]);
inputVal.closest('div').closest('div').find('div[new~="2"]').text(arrayFromDB[2]);

But this doesn't work...


First things first - don't use an ID more than once. IDs are designed to be unique.

Change your IDs for classes if they're not going to be unique.

You can implement the solution you need like this:

HTML

<div class='table_row_div'>
    <div>
        <input type='text' class='txtbox' name='from' value='<?php echo $someVal?>'>
    </div>
    <div class='split'>
        <div new="0">First split value</div>
        <div new="1">Second split value</div>
        <div new="2">Third split value</div>
    </div>
</div>

jQuery

$('.txtbox').each(function() {
    var arrayFromDB = $(this).val().split(',');
    var splitDiv = $(this).closest('.table_row_div').find('.split');
    $('div[new~="0"]', splitDiv).text(arrayFromDB[0]);
    $('div[new~="1"]', splitDiv).text(arrayFromDB[1]);
    $('div[new~="2"]', splitDiv).text(arrayFromDB[2]);
});

Working demo on jsfiddle.net.


It might help if you properly close the div tags with the "new" attribute.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜