Wikki
Wikki

Reputation: 590

How to get child elements of dragged element in jQuery UI

I have drag and drop function on my web page. The dragged div contains 2 input>hidden which are dropped on another div.

At drop event i want to fetch values of both input>hidden in a variable.

Below is my draggable structure.

<div class="srcfield" title="Drag and map Last Name!">
<span><img src="images/cursor1.png" height="14" width="14" border="0"/>&nbsp;&nbsp;First Name</span>
<input type="hidden" name="FieldName" value="FirstName"/>
<input type="hidden" name="SourceType" value="B"/>

When i do:

ui.draggable.children("input").attr("name")

it gives me first hidden field only.

How can i get second hidden field

thanks WK

Upvotes: 2

Views: 1448

Answers (1)

mreq
mreq

Reputation: 6532

First of all, your HTML isn't correct.

Secondly ui.draggable.children("input") is not a single element and .attr("name") is not the value. If you want to fetch the values, you have to iterate the ui.draggable.children("input").attr("name") and use .val()

For instance:

ui.draggable.children("input").each(function(){
  alert($(this).val());
});

If you want to get only a specific value, consider adding classes to the inputs and addressing them by that class. For more info about used functions, check the jQuery's docs

Upvotes: 3

Related Questions