提交表單與圖像提交按鈕 - 無刷新

目前我有它有一個圖像作爲提交表單。它正常工作，因爲在表單變量傳遞和處理。但是，每次單擊表單提交表單時頁面都會刷新，因爲處理頁面的頁眉已返回表單頁面。提交表單與圖像提交按鈕 - 無刷新

我需要一種方法來發送表單變量不清爽。我明白它可以通過ajax完成。然而，我面臨一個概率，因爲我的提交按鈕是一個圖像。任何幫助就如何我可以糾正我的代碼提交表單，而不刷新將是巨大的

<form name ="nominate" action="" id ="nominate" method="POST"> 
     <input type="hidden" name="id" value="<?php echo $id;?>"> 
     <input type="hidden" name="screenName" value="<?php echo $author;?>"> 
     <input type="hidden" name="course" value="<?php echo $course;?>"> 

//this is the image submit button 


<input type="image" style="float: left;" onMouseOver="this.src='images/nominated.png'" 
      onMouseOut="this.src='images/nominate.png'" value="Place Order" src="images/nominate.png" width="60" height="20"> 

</form> 

<script> 
    $(function() { 
    $(".button").click(function() { 
    var id = $("#id").val(); 
    var screenName = $("#screenName").val(); 


    var dataString = 'id='+ id + '&screenName=' + screenName + '&course=' + course; 
    alert (dataString); 
    $.ajax({ 
     type: "POST", 
     url: "nominate.php", 
     data: dataString, 
     success: function(){ 
     alert(dataString); 
     } 
    }); 


    }); 
    }); 

</script>

來源

2012-03-05 coding_beginner

你做了應該工作，如果你的類「按鈕」添加到圖像中的代碼。

<input type="image" class="button"....

來源

2012-03-05 20:12:33

添加類 '按鈕' 你的形象。

而且，你似乎並不具備course任何地方所定義。你也可能想解決這個問題。

來源

2012-03-05 20:13:48 SenorAmor

OMG！我不相信我忘記調用php的課程變量。我已經宣佈它在頂部，但沒有把它分配爲一個JavaScript變量。但是，警報現在顯示ID和課程未被傳遞。 – 2012-03-05 20:25:49

您是否確認您的隱藏表單字段正在由PHP填充。 '$ id'和'$ author'可能不包含任何數據。 – SenorAmor 2012-03-05 20:32:09

首先，你需要將id屬性添加爲jQuery的$("#")是元素的ID。

<input type="hidden" name="id" id="id" value="<?php echo $id;?>"> 
<input type="hidden" name="screenName" id="screenName" value="<?php echo $author;?>"> 
<input type="hidden" name="course" id="course" value="<?php echo $course;?>">

然後作爲所述由Andrew要麼添加class="button"或使用$("#some_id")，然後給該按鈕輸入的id="some_id"。

$(".button").click(function(){ 
var url = "nominate.php"; 
var id = $("#id").val(); 
var screenName = $("#screenName").val(); 
var course = $("#course").val(); 

$.post(url,{id:id, screenName:screenName , course:course }, function(data){ 

alert(data); 

    }); 

});

這將提醒不管你從「nominate.php」送回去。確保從腳本中刪除header()，並可能發回成功或錯誤消息。

來源

2012-03-05 20:30:03 Zac

我把在ID爲每個字段但經過測試，我發現，通過傳遞的ID總是在列表中的第一個ID。我不確定爲什麼會這樣。我是否需要將ajax放入循環中？ – 2012-03-06 07:10:07

提交表單與圖像提交按鈕 - 無刷新

回答

相關問題