[英]Basic form submission with jquery/ajax not working
我是jquery和ajax的新手。 我正在嘗試使我的第一個Ajax腳本正常工作,但是它無法正常工作,請給我一些幫助。
我有一個php頁面,該頁面應該發布到另一個php頁面,后者將進行一些處理並獲取一些文件以進行壓縮和下載。 用戶需要輸入開始和結束日期,第二個php腳本將使用此信息來准備數據。 沒有jquery時,此功能可以很好地工作,但是添加jquery時不起作用。
我想實現什么? 我想發布到相同的php頁面,並在<div></div>
標簽中獲取發布輸出。
我的第一個php頁面包含( downloadPage.php
):
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<form action="doDownload.php" method="post" id="dateRangeID">
<input id='time1' class='input' name="datefield1" style="text-align:center;"/>
<input id='time2' class='input' name="datefield2" style="text-align:center;"/>
<input type="submit" value="Download Data" name="submit" id="submitButton">
</form>
<div id="result"></div> <!-- I would like it to post the result here //-->
第二頁( doDownload.php
),
<div id="content">
<?php
if(isset($_POST['submit']))
{
$dateVal1 = $_POST['datefield1'];
$dateVal2 = $_POST['datefield2'];
if($dateVal1 != $dateVal2)
{
header('Content-Type: application/zip');
header('Content-disposition: attachment; filename="file.zip"');
$fullListOfFiles = $downloadFullTmpFolder.$filesList;
$command = "sudo $ldlib -u myuser /usr/bin/python3 $downloadScriptFile -datadir $gnomeDataDir -time1 $dateVal1C -time2 $dateVal2C -outdir $downloadFullTmpFolder > debug_download.txt 2>&1";
$output = shell_exec($command);
$fp = popen('cat '.$fullListOfFiles.' | sudo -u myuser zip -@ -9 - ', 'r');
$bufsize = 1024;
$buff = '';
while( !feof($fp) )
{
$buff = fread($fp, $bufsize);
echo $buff;
}
pclose($fp);
}
else
{
echo("<p>Dates have to be different in order for the download to start.</p>");
}
}
else
{
echo("<p>Error: Page called without submit.</p>");
}
?>
</div>
最后, downloadPage.php
的jquery部分,如果我添加了它,將不再起作用(我想學習正確的方法, 我主要從jquery的手冊中學習了該鏈接中的最后一個示例)
<script>
/* attach a submit handler to the form */
$("#dateRangeID").submit(
function(event)
{
event.preventDefault();
var $form = $(this),
t1 = $form.find("input[name='datefield1']").val(),
t2 = $form.find("input[name='datefield2']").val(),
subm = $form.find("input[name='submit']").val(),
url = $form.attr('action');
var posting = $.post(url, { datefield1: t1, datefield2: t2, submit: subm} );
/* Put the results in a div */
posting.done(function(data) {
var content = $(data).find('#content'); // <--- So this turns out to be wrong. Right is only $(data);
$("#result").empty().append(content);
});
});
</script>
這有什么問題? 請協助。 謝謝。
如果您需要任何其他信息,請詢問。
看看顯而易見的地方,您可以:
var content = $(data).find('#content');
在這里,您嘗試在以下結果之一中查找具有ID content
的元素:
<p>Dates have to be different in order for the download to start.</p>
要么
<p>Error: Page called without submit.</p>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.