原型ajax更新DIV與不同的按鈕

我正在學習它，但我找不到這是什麼錯誤！我想讓div2從div1中的表單中獲取數據，稱爲formulario。我想知道哪個項目被選中，哪個按鈕被點擊。原型ajax更新DIV與不同的按鈕

主HTML文件：

<script src="utils/Scripts/prototype.js" type="text/javascript"></script> 
<script type="text/javascript"> 

function sendf(formul, divi, php) 
    { 
    var params = Form.serialize($(formul));      
    new Ajax.Updater(divi, php, {method: 'post', parameters: params, asynchronous:true}); 
    } 
</script> 

</head> 

<body> 
<div id="div1"> 
contenido div1 
<form id="formulario" method="POST"> 
<select size="3" id="lista" onchange="sendf('formulario', 'div2', 'prodiv1.php');"> 
<option>elemento 1</option> 
<option>elemento 2</option> 
<option>elemento 3</option> 
</select> 
<input type="button" id="b1" value="bot1" onclick="sendf('formulario', 'div2', 'prodiv1.php');" /> 
<input type="button" id="b2" value="bot2" onclick="sendf('formulario', 'div2', 'prodiv1.php');" /> 
</form> 


<div id="div2" style="background: blue;"> 
contenido div2 
</div> 
</div> 
</body> 
</html>

php文件，prodiv1.php：

<? 
echo 'exec: prodiv1.php<br>'; 
print_r($_POST); 
echo serialize($_POST); 

if (isset($_POST)) 
    { 
    foreach ($_POST as $key=>$value) 
     { 
     echo $key.'=>'.$value."<br>"; 
     } 
    } 


echo "select: ".$_POST['lista']; 

if (isset($_POST['b1'])) {echo 'click: boton1';} else {echo 'click: boton2';} 
?>

我已經嘗試了很多東西，並看到它可能與事件的觀察員來完成， httprequests等，但我需要的是很容易，並可能有一個優雅的方式來解決它... 我提前感謝任何幫助！祝您有愉快的一天。 guillem

來源

2009-12-10 guillem

你確實需要你的表單提交給服務器端表單處理腳本嗎？ – robjmills 2009-12-12 16:50:19

編輯看看你發佈的其他代碼是否真的需要AJAX？當然你只是用頁面上已經存在的數據更新現有頁面，服務器沒有真正的部分可以在這裏播放？

對不起，再次潛入jQuery，但這應該允許您在沒有ajax請求的情況下將值存入「div2」。

$(document).ready(function() { 
     $("input").click(function(e) { 
      $("#div2").html($(this).attr("id")+" clicked<br />"); 
      updateList(); 
     }); 
    }); 
    function updateList() { 
     $("#div2").append($("#lista").val() + " selected"); 
    }

用簡單的英語這個代碼表示，「如果點擊輸入元素，更新與輸入變量標識DIV2的值，然後從列表中的結果追加選定的值」。希望對你有意義:)

如果你需要一個簡單，優雅的方式來解決這個問題，使用jQuery庫的ajax和post方法。有關更多信息，請參閱here，它將顯着減少代碼的大小和複雜性。

來源

2009-12-10 00:44:47 Jay

不需要爲此切換到jQuery，原型是綽綽有餘的 – robjmills 2009-12-12 16:47:38

是的jQuery絕對不需要這個，我原來的帖子是關於AJAX，它更容易執行和描述在jQuery中，就像上面的操作（寫少，做更多）。 – Jay 2009-12-13 11:03:34

如果你不需要以某種方式實際處理表單內容，那麼你不需要使用Ajax傳遞給PHP腳本。這依賴於你想在2區，你可以做這樣簡單的東西來顯示什麼：

function sendf() 
{ 
var listvar = $('lista').value; 
$('div2').update('select menu value was ' + listvar); 
}

這顯然是缺少了很多細節，可以極大的改進，但應該強調的事實是AJAX是不是必需的。

來源

2009-12-12 16:57:21 robjmills

@jay：他使用原型，所以我的代碼是正確的，你的代碼是jquery – robjmills 2009-12-13 22:11:59

它可能是值得一提的你的JavaScript庫在你的答案，因爲它最初並不清楚你使用的是原型，並且這段代碼不會起作用沒有它:) – Jay 2009-12-15 10:37:14

是的，但他已標記他的問題與原型和他的代碼示例鏈接到原型，我會說這很清楚。 – robjmills 2009-12-15 10:49:13

原型ajax更新DIV與不同的按鈕

回答

相關問題