html giriş alanından değer elde edin

Question

id="new_amount" ile giriş değerini nasıl alabilirim? Şu an çalıştığım şu ki doğru değil:

<td> 
    <input type="button" 
onclick="location.href='${pageContext.request.contextPath}/update?id=${object.id}&?amount=${document.getElementById("new_amount").value}';" 
value="Change Amount" /> 
</td> 

Birisi bana yardım edebilir mi?

<table class=goods> 
<tr> 
    <td>Name</td> 
    <td>Amount</td> 
</tr> 
<c:forEach var="object" items="${goods}"> 
    <tr> 
     <td id="name"><c:out value="${object.name}"></c:out></td> 
     <td id="amount"><c:out value="${object.amount}"></c:out></td> 
     <td id="new_amount"><p>New amount:</p> <input type="number" id="new_amount" /></td> 
     <td><input type="button" 
      onclick="location.href='${pageContext.request.contextPath}/update?id=${object.id}&?amount=${document.getElementById("new_amount").value}';" value="Change Amount" /></td> 
     <td><input type="button" onclick="location.href='${pageContext.request.contextPath}/delete?id=${object.id }';" value="Delete"/></td> 
    </tr> 
</c:forEach> 
<tr> 
    <td><a href="${pageContext.request.contextPath }/addgoods">Add new 
     goods</a></td> 
</tr> 

Answer 1

Ben üç sıra ile (döngü için) bazı statik geçici çözümü yaptık. Size yardımcı olacaktır.

Tabloya kimlik verin, değeri doğrudan eklemek yerine, doğrudan arama işlevim var ve object_id için gizli değeri kullanın. Ayrıca, öğeyi bulmak için sınıf ekledik (ID, yinelenen öğeler için iyi bir fikir değildir).

Yapmanız gereken tek şey, JSTL kodunuz ile statik değerleri değiştirmenizdir.

window.updateObject = function(object){ 
    // Get nearest text box values based on class. 
    var object_id = $(object).closest('tr').find('.goods_id').val(); 
    var amount = $(object).closest('tr').find('.amount').val(); 
    alert("ID : "+object_id+" Amount :"+amount); 
} 

window.deleteObject = function(object){ 
    var object_id = $(object).closest('tr').find('.goods_id').val(); 
    alert("ID : "+object_id); 
} 

<table id="goods"> 
    <tr> 
     <th>Name</th> 
     <th>Amount</th> 
     <th>New Amount</th> 
     <th>Actions</th> 
    </tr> 
    <tr> 
     <td>test1</td> 
     <td>100</td> 
     <td><input type="number" name="new_amount" class="amount" /></td> 
     <td><input type="button" onclick="updateObject(this)" value="Edit" />/<input type="button" onclick="deleteObject(this)" value="Delete"/></td> 
     <input type="hidden" value="1" class="goods_id" /> 
    </tr> 
    <tr> 
     <td>test2</td> 
     <td>200</td> 
     <td><input type="number" name="new_amount" class="amount" /></td> 
     <td><input type="button" onclick="updateObject(this)" value="Edit" />/<input type="button" onclick="deleteObject(this)" value="Delete"/></td> 
     <input type="hidden" value="2" class="goods_id" /> 
    </tr> 
    <tr> 
     <td>test3</td> 
     <td>300</td> 
     <td><input type="number" name="new_amount" class="amount" /></td> 
     <td><input type="button" onclick="updateObject(this)" value="Edit" />/<input type="button" onclick="deleteObject(this)" value="Delete" /></td> 
     <input type="hidden" value="3" class="goods_id" /> 
    </tr> 
</table> 

tıklanan satırın değerlerini almak için bu işlevleri kullanın Demo bakınız. Gerekirse daha fazlasını açıklayabilirim. Bu yardımcı olur umarım. Güncelleme

: HTML'de

, Gerçek gerekliliktir aşağıda benziyor, ben yapmış bu JSTL Betiğinde

<table id="goods"> 
<tr> 
    <td>Name</td> 
    <td>Amount</td> 
    <td>New Amount</td> 
    <td>Actions</td> 
</tr> 
<c:forEach var="object" items="${goods}"> 
    <tr> 
     <td><c:out value="${object.name}"></c:out></td> 
     <td><c:out value="${object.amount}"></c:out></td> 
     <td><p>New amount:</p> <input type="number" id="new_amount" class="amount" /></td> 
     <td><input type="button" onclick="updateObject(this)" value="Change Amount" />/
      <input type="button" onclick="deleteObject(this)" value="Delete"/></td> 
     <input type="hidden" value="${object.id}" class="goods_id" /> 
    </tr> 
</c:forEach> 
<tr> 
    <td><a href="${pageContext.request.contextPath }/addgoods">Add new 
     goods</a></td> 
</tr> 

,

window.updateObject = function(object){ 
    // Get nearest text box values based on class. 
    var object_id = $(object).closest('tr').find('.goods_id').val(); 
    var amount = $(object).closest('tr').find('.amount').val(); 
    //alert("ID : "+object_id+" Amount :"+amount); 
    location.href='${pageContext.request.contextPath}/update?id=object_id&?amount=amount'; 
} 

window.deleteObject = function(object){ 
    var object_id = $(object).closest('tr').find('.goods_id').val(); 
    //alert("ID : "+object_id); 
    location.href='${pageContext.request.contextPath}/delete?id=object_id'; 
}