<script> $("#submit").click(function(e){ e.preventDefault(); subjectID = $("#subjectID").val(); subject = $("#subject_"+subjectID).val(); subject_code = $("#subject_code_"+subjectID).val(); internal_marks = $("#internal_marks_"+subjectID).val(); external_marks = $("#external_marks_"+subjectID).val(); alert(subjectID); alert(subject); alert(subject_code); alert(internal_marks); alert(external_marks); });</script> <?php foreach ($subject as $row) {?> <div class="form-group"> <div class="col-sm-3"> <div class="select2-wrapper"> <input type="hidden" name="subjectID" id="subjectID" value="<?php echo $row['subjectID']; ?>"> <input type="text" class="form-control" id="subject_<?php echo $row['subjectID']; ?>" value="<?php echo $row['subject']; ?>"> </div> </div> <div class="col-sm-3"> <div class="select2-wrapper"> <input type="text" class="form-control" id="subject_code_<?php echo $row['subjectID']; ?>" value="<?php echo $row['subject_code']; ?>"> </div> </div> <div class="col-sm-3"> <div class="select2-wrapper"> <input type="text" class="form-control" id="internal_marks_<?php echo $row['subjectID']; ?>"> </div> </div> <div class="col-sm-3"> <div class="select2-wrapper"> <input type="text" class="form-control" id="external_marks_<?php echo $row['subjectID']; ?>"> </div> </div> </div><?php }?><div class="form-group"> <div class="col-sm-12"> <input type="submit" class="btn btn-success add-btn" id="submit" value="Submit"> </div></div>在這段代碼中，我在 foreach 循環中有多個輸入字段，我想使用 jquery 獲取所有值，但是當我單擊提交按鈕時會發生什么，我只能獲取單行值。那么，我該怎么做呢？請幫我。
1 回答
慕森卡
TA貢獻1806條經驗 獲得超8個贊
首先向您的行添加一個新類，如下所示：
<?php
foreach ($subject as $row)
{
?>
<div class="form-group someClass">
//-------------------------^
然后each像這樣在循環中使用并查找值：
$("#submit").click(function(e) {
e.preventDefault();
$('.someClass').each(function() {
subjectID = $(this).find("#subjectID").val();
subject = $(this).find("#subject_" + subjectID).val();
subject_code = $(this).find("#subject_code_" + subjectID).val();
internal_marks = $(this).find("#internal_marks_" + subjectID).val();
external_marks = $(this).find("#external_marks_" + subjectID).val();
console.log(subjectID);
console.log(subject);
console.log(subject_code);
console.log(internal_marks);
console.log(external_marks);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group someClass">
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="hidden" name="subjectID" id="subjectID" value="1">
<input type="text" class="form-control" id="subject_1" value="1">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="subject_code_1" value="1">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="internal_marks_1" value="1">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="external_marks_1" value="1">
</div>
</div>
</div>
<br/><br/>
<!-- s2 -->
<div class="form-group someClass">
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="hidden" name="subjectID" id="subjectID" value="2">
<input type="text" class="form-control" id="subject_2" value="2">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="subject_code_2" value="2">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="internal_marks_2" value="2">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="external_marks_2" value="2">
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input type="submit" class="btn btn-success add-btn" id="submit" value="Submit">
</div>
</div>
只需復制js部分，不要使用我的html，因為我編輯并使用了一些示例，values我還建議您將結果作為array, object.
$("#submit").click(function(e) {
e.preventDefault();
let array = [];
$('.someClass').each(function() {
subjectID = $(this).find("#subjectID").val();
subject = $(this).find("#subject_" + subjectID).val();
subject_code = $(this).find("#subject_code_" + subjectID).val();
internal_marks = $(this).find("#internal_marks_" + subjectID).val();
external_marks = $(this).find("#external_marks_" + subjectID).val();
obj = {
id: subjectID,
subject: subject,
subject_code: subject_code,
internal_marks: internal_marks,
external_marks: external_marks
}
array.push(obj)
});
console.log(array)
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group someClass">
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="hidden" name="subjectID" id="subjectID" value="1">
<input type="text" class="form-control" id="subject_1" value="1">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="subject_code_1" value="1">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="internal_marks_1" value="1">
</div>
</div>
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="text" class="form-control" id="external_marks_1" value="1">
</div>
</div>
</div>
<br/><br/>
<!-- s2 -->
<div class="form-group someClass">
<div class="col-sm-3">
<div class="select2-wrapper">
<input type="hidden" name="subjectID" id="subjectID" value="2">
<input type="text" class="form-control" id="subject_2" value="2">
</div>
</div>
- 1 回答
- 0 關注
- 160 瀏覽
添加回答
舉報
0/150
提交
取消