0

私がやっていること:

フォームといくつかのボタンを含むdivを追加しています.2つのボタンは保存とキャンセルです.保存をクリックすると、フォームを投稿して応答を取得しています.保存がクリックされた古いdivを置き換えたい.

これはhtmlとjqueryですhttp://jsfiddle.net/thiswolf/vSnJJ/1/

私はこのphpを使用していますが、投稿データは例であるためサニタイズされていません

<?php
/**
test if replaced item can post and be deleted
@move ---->next
*/
$sliderKey = $_POST['sliderKey'];
$sliderPosition = $_POST['sliderPosition'];
$sliderTitle = $_POST['sliderTitle'];
$sliderLocation = $_POST['sliderLocation'];
$sliderDescription = $_POST['sliderDescription'];
$uniqid = uniqid();
echo "<div class='krudItem' id='$uniqid'><form class='aj' name='itemForm' method='post'action=''><section><label>Slider Title</label><input type='hidden' name='sliderKey' value='$sliderKey'/><input type='hidden' name='sliderPosition' value='$sliderPosition'/><input type='text' name='sliderTitle' value='$sliderTitle'/></section><section><label>Slider Location</label><input type='text' name='sliderLocation' value='$sliderLocation'/></section><section><label>Slider Description</label><textarea name='sliderDescription'>THIS IS THE REPLACEMENT</textarea></section><button name='saveNew' class='saveNew' id='$uniqid'>save</button><button name='newCancel'>delete</button></form></div>";

?>

これは私が使用しているjquery全体です

jQuery(function() {
function randString(n)
{
    if(!n)
    {
        n = 5;
    }

    var text = '';
    var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';

    for(var i=0; i < n; i++)
    {
        text += possible.charAt(Math.floor(Math.random() * possible.length));
    }

    return text;
}


 $("#button").click(function () {
$("<div class='krudItem' id='xxx'><form class='aj' name='itemForm' method='post' action=''><section><label>Slider Title</label><input type='hidden' name='sliderKey' value='16'/><input type='hidden' name='sliderPosition' value='12'/><input type='hidden' name='clickedButton' value='initial'/><input type='text' name='sliderTitle' value='lorem'/></section><section><label>Slider Location</label><input type='text' name='sliderLocation' value='ipsum'/></section><section><label>Slider Description</label><textarea name='sliderDescription'>hello world</textarea></section><button name='saveNew' class='saveNew' id='buttonId' value='saveNew'>save</button><button name='newCancel'>cancel</button></form></div>").appendTo('.krudSpace'); 
});
//save new
jQuery('.saveNew').live("click",function(event)
    {
     jQuery(this).attr("id",randString(7));
    event.preventDefault();
     var contentPanelId = jQuery(this).attr("id");

    jQuery.ajax({
    type: "POST",
    url: "insert.php",
   data: jQuery(".aj").serialize(),
  success: function(data){
  var quoted = "#"+contentPanelId;
  jQuery(quoted).replaceWith(data)
  }
 });
 return false; 
 });
});

ある程度は機能しますが、古い div はまったく置き換えられませんが、古い div の下に応答が追加されます。

4

1 に答える 1

1

あなたは物事を難しくしています。親自体を保存するだけです：

var $p = jQuery(this).parent();

そして、やります：

$p.replaceWith(data)

更新された jsFiddle は次のとおりです ( PHP がないためではerrorなく使用されます): http://jsfiddle.net/vSnJJ/2/。success

于 2012-09-16T09:49:44.630 に答える