Stripes и Ajax - Как отправить данные на сервер и обновить таблицу данными с помощью AJAX - PullRequest
Новая
       1

Stripes и Ajax - Как отправить данные на сервер и обновить таблицу данными с помощью AJAX

0 голосов
/ 16 февраля 2012

Я занимался серфингом в Интернете, как использовать AJAX с полосами, и обнаружил это . Однако в документации объясняется использование инфраструктуры прототипов в качестве сценария на стороне клиента. Не Javascript. Но я хочу использовать вместо этого JavaScript.

Я думаю, что этот блок использует библиотеку прототипов. 

<script type="text/javascript"
              src="${pageContext.request.contextPath}/ajax/prototype.js"></script>
      <script type="text/javascript" xml:space="preserve">
          /* ... */
          function invoke(form, event, container) {
              if (!form.onsubmit) { form.onsubmit = function() { return false } };
              var params = Form.serialize(form, {submit:event});
              new Ajax.Updater(container, form.action, {method:'post', parameters:params});
          }
      </script>

Как я могу изменить его на javascript? Или я что-то не так понял. Моя главная цель - когда пользователь нажимает кнопку, я хочу отправить эти данные на сервер и отобразить их в таблице, не обновляя всю страницу. У меня есть ActionBean, который будет сохранять данные.

Спасибо.

1 Ответ

1 голос
/ 16 февраля 2012

Если вы не собираетесь импортировать библиотеку (что я бы порекомендовал, потому что этот код может быть немного тяжелым для не-JS-программистов), то вам нужно будет создать объект XMLHttpRequest самостоятельно.На MDN есть хорошее руководство , которое охватывает основы, но обычно это делается так: 

// Build the object
var httpRequest;  
if (window.XMLHttpRequest) { // Mozilla, Safari, ...  
    httpRequest = new XMLHttpRequest();  
} else if (window.ActiveXObject) { // IE 8 and older  
    httpRequest = new ActiveXObject("Microsoft.XMLHTTP");  
}
// Add the function for handling changes to state
httpRequest.onreadystatechange = function () {
    // Check the state of the request
    if (httpRequest.readyState === 4) {
        // The server has finished sending data and we are ready to handle it
        if(httpRequest.status < 400) {
            // Request was successful, Put your code for handling the response here
            // String of what the response was will be in httpRequest.responseText
        } else {
            // Request was not successful, probably want to display an error
        }
    } else {
        // Response is still being received and is not quite ready yet.
    }
}
// Now that we can handle it, we want to send the request
httpRequest.open("GET", "http://example.com");
// Don't forget to send it :)
httpRequest.send();

Как видите, это не самый простой код.Я настоятельно рекомендую прочитать страницу MDN по теме , поскольку она поможет вам понять приведенный выше код.Это может помочь вам сделать больше вещей, таких как отправка данных вместе с вашим запросом.Не то чтобы сериализация и отправка формы здесь - это больше, чем мой пример выше.Если вы хотите отправить форму, вы должны внимательно прочитать статью.

Почему я рекомендую JS-библиотеку, такую ​​как Prototype или jQuery, потому что они делают все это (и более)намного проще

...