M Akela
M Akela

Reputation: 249

Get values of multiple textboxes with seporator through jquery

I have following Html

<li>
    <input id="txtsDate3" class="txtdate" type="text" placeholder="Select Date">
    <input id="txtsHrs3" class="txthours" type="text" placeholder="Hrs">
    <a class="btnadd" title="Add" href="javascript:void(0)"></a>
    <a id="btndel3" class="btndelete" title="Delete" href="javascript:void(0)"></a>
    <input type="hidden" id="hdnvalue3" />
</li>

<li>
    <input id="txtsDate4" class="txtdate" type="text" placeholder="Select Date">
    <input id="txtsHrs4" class="txthours" type="text" placeholder="Hrs">
    <a class="btnadd" title="Add" href="javascript:void(0)"></a>
    <a id="btndel4" class="btndelete" title="Delete" href="javascript:void(0)"></a>
    <input type="hidden" id="hdnvalue4" />
</li>

<li>
    <input id="txtsDate5" class="txtdate" type="text" placeholder="Select Date">
    <input id="txtsHrs5" class="txthours" type="text" placeholder="Hrs">
    <a class="btnadd" title="Add" href="javascript:void(0)"></a>
    <a id="btndel5" class="btndelete" title="Delete" href="javascript:void(0)"></a>
    <input type="hidden" id="hdnvalue5" />
</li>

in one li there is one textbox for date, one for hours, one hidden field for Id

i have requirement to get the values of date textbox , hrs textbox, and value of hidden field separted with @@ like

12-12-2003@@5@@112###12-11-2004@@7@@113 and so one

I am completely lost how to achieve it

I am very much new in jquery , and not able to even proceed,

Upvotes: 0

Views: 734

Answers (2)

coolguy
coolguy

Reputation: 7954

$(document).ready(function(){
var chunk = "";
$('ul li:not(eq(0)').each(function(){

chunk+=$(this).find('.txtdate').val()+"@@"+$(this).find('.txthours').val()+"@@"+$(this).find('input:hidden').val()+"###";

});

alert(chunk);

});

Upvotes: 1

karim79
karim79

Reputation: 342635

var collection = $("li").map(function  () {
    var date = $(this).find(".txtdate").val()
    ,   hour = $(this).find(".txthours").val()
    ,   hiddenVal = $(this).find("input[type='hidden']").val();
    return date + "@@" + hour + "@@" + hiddenVal;
}).get();
console.log(collection);

Demo.

Upvotes: 1

Related Questions