iT邦幫忙

0

PHP接收Jquery動態新增的值

各位大大好
小弟碰到了一個問題
目前是要動態決定是否新增"條款"的欄位
新增動態欄位是可以正常運作的(前端沒問題)
在送出前的Jquery也抓的到新增欄位中的值
但是問題就是出現在submit之後
PHP無法抓到新增後的動態欄位值
也就是terms3,terms4....

after不是有把元素寫進DOM裡面嗎

Jquery:

//新增條款
	$('#add_terms').click(function(){
		var i = $('#terms>textarea').length;
		$terms = $('#terms'+i);
		i++;
		console.log($terms);
		$terms.after('<br><br>'+i+'.    <textarea id="terms' + i + '" name="terms[]" ' + 'cols="60" rows="2" style="vertical-align:middle;"></textarea>');
	})

條款1和2有先預設好
PHP只抓的到 terms1 和 terms2
HTML:

<table>
    <form  method="post" enctype="multipart/form-data" name="form1" id="form1" action='' target="_self">
        <tr>
            <td align="center"> 條款</td>
            <td id="terms"> 
            1.   
            <textarea id="terms1" name="terms[]" cols="60" rows="2" style="vertical-align:middle;"><?php echo $terms1?></textarea> 
            <br><br>
            2.   
            <textarea id="terms2" name="terms[]" cols="60" rows="2" style="vertical-align:middle;"><?php echo $terms2?></textarea>
            <br>   
            <input id="add_terms" name="add_terms" type="button"  class="bt-add" value="繼續新增條款" style="margin-top:10px">
            </td>
        </tr>
        <tr>
            <td colspan="2" align="center">
            <input id="add" name="add" type="submit"  value="新增"  >
            <input id="clear" name="clear" type="reset"  class="bt-return" value="清空">
            </td>
        </tr>
    </form>
</table>

PHP:

//file_get_contents('php://input'); 也抓不到
print_r($terms);

圖片:
新增前:
https://ithelp.ithome.com.tw/upload/images/20200217/201235657KaKfnQG4b.jpg
新增後:
https://ithelp.ithome.com.tw/upload/images/20200217/20123565cdH5q7Tybr.jpg
結果(我確定有打條款3和4):

Array ( [0] => 1 [1] => 2 )

請問小弟是哪裡沒注意到呢

froce iT邦大師 1 級 ‧ 2020-02-17 17:21:35 檢舉
這種...整理成json比較好做
st474ddr iT邦新手 5 級 ‧ 2020-02-17 17:27:21 檢舉
> 這種...整理成json比較好做
願聞其詳
不過我也是想知道我問題出在哪QQ
1
舜~
iT邦高手 1 級 ‧ 2020-02-17 16:57:25
最佳解答

php抓到的是html的name,不是id

您新增的東西應該會在 $_POST['terms'] 中

還有就是您的jQuery段落的這個寫法name不確定是否會符合預期...(沒測試)

$terms.after('<br><br>'+i+'.    <textarea id=terms' + i + ' name=terms[] ' + 'cols="60" rows="2" style="vertical-align:middle;"></textarea>');

看要不要嚴謹一點,單雙引號上好上滿

$terms.after('<br><br>'+i+'.    <textarea id="terms' + i + '" name="terms[]" ' + 'cols="60" rows="2" style="vertical-align:middle;"></textarea>');

我剛剛試了一下您的代碼發現一件事
您只要把< form>標籤改放到< table>外面就可以了~~~

說明:我補上了< table>標籤,加了送出按鈕,from標籤移動到table外面

<body>
	<?php print_r($_POST); // 測試用 ?>
	<form method="post" enctype="multipart/form-data" name="form1" id="form1" action='' target="_self">
		<table>
			<td align="center"> 條款</td>
			<td id="terms">
				1.
				<textarea id="terms1" name="terms[]" cols="60" rows="2" style="vertical-align:middle;"></textarea>
				<br><br>
				2.
				<textarea id="terms2" name="terms[]" cols="60" rows="2" style="vertical-align:middle;"></textarea>
				<br>
				<input id="add_terms" name="add_terms" type="button" class="bt-add" value="繼續新增條款" style="margin-top:10px">
				<input type="submit" value="送出">
			</td>
		</table>
	</form>
</body>
看更多先前的回應...收起先前的回應...
st474ddr iT邦新手 5 級 ‧ 2020-02-17 16:58:22 檢舉

這我明白大大
抱歉後端沒打出來讓您誤會了
我後端是用陣列去抓的 已補上

舜~ iT邦高手 1 級 ‧ 2020-02-17 17:04:12 檢舉

您試試這個 print_r($_POST['terms']);

st474ddr iT邦新手 5 級 ‧ 2020-02-17 17:06:39 檢舉

您試試這個 print_r($_POST['terms']);

再跟您抱歉一次 大大
我的print_r($terms);
是由您的例子處理過後的簡化

我也有用您的再嘗試看看
但一樣是沒有顯示

st474ddr iT邦新手 5 級 ‧ 2020-02-17 17:10:26 檢舉

會不會是這樣方法動態新增元素
PHP吃不到呢

舜~ iT邦高手 1 級 ‧ 2020-02-17 17:12:02 檢舉

Jquery段落的 $terms.after(...) 微調一下看看,可能是沒上單雙引號導致的行為異常

st474ddr iT邦新手 5 級 ‧ 2020-02-17 17:18:51 檢舉

我改了還是無法顯示
不過還是謝謝大大的提醒

舜~ iT邦高手 1 級 ‧ 2020-02-17 19:48:08 檢舉

我剛剛試了一下您的代碼發現一件事
您只要把< form>標籤改放到< table>外面就可以了~~~

舜~ iT邦高手 1 級 ‧ 2020-02-17 20:20:08 檢舉

補充說明:我補上了< table>標籤,加了送出按鈕,from標籤移動到table外面

st474ddr iT邦新手 5 級 ‧ 2020-02-18 09:13:42 檢舉

把< form>標籤改放到< table>外面就可以了

確實是這樣感謝大大
我想請問為何有如此影響??
我有稍微查了一下
貌似是規定是嗎?

舜~ iT邦高手 1 級 ‧ 2020-02-18 12:22:02 檢舉

我覺得這要看瀏覽器,每個瀏覽器的狀況可能會不一樣,詳細狀況我沒深入研究

0
firecold
iT邦新手 3 級 ‧ 2020-02-17 17:38:41

https://blog.wu-boy.com/2012/04/use-on-api-to-attach-event-handlers-on-jquery/

sor 一開始沒看清楚

把i拿出
元素一開始就定好了你那樣寫不會重抓
直接用i判斷就好
你改完後端應該就接收的到了

//新增條款
    i = $('#terms>textarea').length;
	$('#add_terms').click(function(){
		$terms = $('#terms'+i);
		i++;
		console.log($terms);
		$terms.after('<br><br>'+i+'.    <textarea id="terms' + i + '" name="terms[]" ' + 'cols="60" rows="2" style="vertical-align:middle;"></textarea>');
	})

我用你的code跑不動
https://codepen.io/firecold/pen/XWbdxMO

以下我改寫的給你參考

<?php

print_r($_POST);
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<form action="0218.php" method="post">
<td align="center"> 條款</td>
<td >
    <div id="terms">
        <div>
        1.
        <textarea id="terms1" name="terms[]" cols="60" rows="2" style="vertical-align:middle;"><?php echo $terms1?></textarea>
        </div>
        <div>
        2.
        <textarea id="terms2" name="terms[]" cols="60" rows="2" style="vertical-align:middle;"><?php echo $terms2?></textarea>
        </div>
    </div>
    <input id="add_terms" name="add_terms" type="button"  class="bt-add" value="繼續新增條款" style="margin-top:10px">
</td>
    <input type="submit">
</form>

<script
        src="https://code.jquery.com/jquery-3.4.1.js"
        integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
        crossorigin="anonymous"></script>
<script>
    //新增條款
    i = $('#terms>div>textarea').length;
    $('#add_terms').click(function(){
        $terms = $('#terms'+i);
        i++;
        $terms.after('<div>'+i+'. <textarea id="terms' + i + '" name="terms[]" ' + 'cols="60" rows="2" style="vertical-align:middle;"></textarea></div>');
    })
</script>
</body>
</html>
看更多先前的回應...收起先前的回應...
st474ddr iT邦新手 5 級 ‧ 2020-02-17 17:41:26 檢舉

大大我不太懂
這好像沒有講到後端的部分!?

st474ddr iT邦新手 5 級 ‧ 2020-02-17 17:56:14 檢舉

把i拿出 元素一開始就定好了你那樣寫不會重抓

大大我不是很懂這什麼意思
我看了您改的 好像只有拿掉var?
我照這樣做之後 結果還是一樣

firecold iT邦新手 3 級 ‧ 2020-02-17 18:04:30 檢舉

你方便提供前端的code嘛
我print_r($_POST);
是正常的

st474ddr iT邦新手 5 級 ‧ 2020-02-17 18:05:31 檢舉

你方便提供前端的code嘛

請問大大還需要哪段
因為我已經把我覺得有關的都po 上來了
我把form也補上了

firecold iT邦新手 3 級 ‧ 2020-02-17 18:16:03 檢舉

你的code我直接貼不能跑
改了一下你看看

st474ddr iT邦新手 5 級 ‧ 2020-02-18 09:07:31 檢舉

你的code我直接貼不能跑

因為大大我為了節省篇幅
沒有把丟進去
所以大大只有td那樣貼 應該不能跑
看來我以後要多貼一點@@
抱歉
感謝大大的回覆

firecold iT邦新手 3 級 ‧ 2020-02-18 10:17:27 檢舉

那個....你submit寫在哪裡?

st474ddr iT邦新手 5 級 ‧ 2020-02-18 11:03:41 檢舉

你submit寫在哪裡

大大我把原本的code補齊了

0
浩瀚星空
iT邦超人 1 級 ‧ 2020-02-17 22:12:34

其實,有個問題我百思不得其解。

那個id有其必要性嘛?

而且,post取值為何不用$_POST來取?

再加上 「cols="60" rows="2"」這兩個不是可以用style或css來處理就好了。
不需要在jquery內組合的要死要活的吧?

你可以參考舜的寫法就好了。再來注意節點的偶合性。

st474ddr iT邦新手 5 級 ‧ 2020-02-18 09:06:12 檢舉

那個id有其必要性嘛

因為目前我Jquery是用id的方式去操作
確實好像也可以改用name

post取值為何不用$_POST來取

大大 其實是已經有透過轉換了
$+任何欄位的name 就等於 $_POST[name]

「cols="60" rows="2"」這兩個不是可以用style或css來處理就好了。

這倒是

感謝大大回覆

我要發表回答

立即登入回答