AJAX Inline Editing: добавление PHP Update к новым изменениям

Я работаю над домашней страницей и буду использовать встроенный скрипт редактирования AJAX для администратора, чтобы сделать его максимально простым. Сценарий, который я использовал, таков, и в нем есть почти все, что я хотел от встроенного сценария редактирования. Моя проблема возникает, когда я собираюсь записать новые изменения и отправить их в функцию PHP, которая обновит мою базу данных этими новыми изменениями.

У меня нет большого опыта работы с AJAX и PHP вместе, поэтому я немного растерялся, но я попробовал код, который нашел:

$.ajax({
  type: "POST",
  url: "update_handler.php",
  data: "newfieldvalue=" + newValue,
  success: function(msg){
    alert( "Data Saved: " + msg );
  }
});

Проблема в том, что я не совсем знаю, как и где реализовать этот код, или даже если это правильный код для использования. Чтобы показать вам код, я приложил два текстовых документа:

Index.php.txt

А также

Jquery.editableText.js.txt

В index.php.txt это индексная страница, на которой он извлекает мои данные из базы данных и использует немного кода jQuery. в jQuery.editableText.js.txt это конкретный код JQuery. Я полагаю, что страница обработчика PHP в значительной степени стандартна: нужно выбрать правильное поле и затем обновить его в базе данных.

Источник

2 ответа

Решение

У меня есть к вам вопросы:

  1. $ menuID содержит идентификатор чего-либо, и вы используете его для извлечения из таблицы по этому идентификатору. Это верно?

Если это правильно, вы должны передать этот идентификатор на страницу обработчика PHP.

Пример:

index.php:

<script type="text/javascript">
jQuery(function($){
    $('h2.editableText, p.editableText').editableText({
        newlinesEnabled: false
    });

    $.editableText.defaults.newlinesEnabled = true;

    $('div.editableText').editableText();

    $('.editableText').change(function(){
        var newValue = $(this).html();

        // important code:
          $.ajax({
          type: "POST",
          url: "save.php",
          data: { val : newValue, key:$(this).parent().tagName, id:$(this).parent().attr('class')},
          success: function(msg){
            alert( "Data Saved: " + msg );
          }
       });

    });

});
</script>

и часть тела:

<body>
<div id="wrapper">
<div id="content">
    <?php 
    $isnull = getContent($menuID, "title");
    if ($isnull != "") {

    echo "<h2 class=\"editableText\"><center><p>" . getContent($menuID, "title") . "</p></center></h2><br>";
    } else {
        null;
    }
    ?>

    <div class="editableText">

<p class="<?php echo $menuID?>"><?php echo getContent($menuID, "maincontent");?></p>
        </div>
    </script>
    <?php

    mysql_close($connection);
?>

и еще один, save.php:

<?php

# content that you send from client; you must save to maincontent
$content=$_POST['val'];

# $from=='div' if it from maincontent or $from=='center' if it from title
$from=$_POST['key'];


# id of your post 
$id=$_POST['id'];

    #here you can save your content;
?>
Источник

Как сказано на странице редактирования на странице, вы должны использовать этот код в блоке скрипта. Значит, у тебя это было? Следующее должно работать (не проверено).

<script type="text/javascript">
    jQuery(function($){
        $('h2.editableText, p.editableText').editableText({
            newlinesEnabled: false
        });

        $.editableText.defaults.newlinesEnabled = true;

        $('div.editableText').editableText();

        //  bind an event listener that will be called when
        //  user saves changed content
        $('.editableText').change(function(){
             var newValue = $(this).html();

             // do something
             // For example, you could place an AJAX call here:
            $.ajax({
              type: "POST",
              url: "update_handler.php",
              data: "newfieldvalue=" + newValue,
              success: function(msg){
                alert( "Data Saved: " + msg );
              }
           });
        });

    });
</script>
Источник
Другие вопросы по тегам