Как мне создать всплывающее окно для отправки данных формы?

Question

Я видел эту запись , которая привела меня к UI / API / 1.8 / Dialog

Я ищу самое основное всплывающее окно для отправки данных формы. Это оно? (Должно ли всплывающее окно отправки данных формы использовать ajax?)

Спасибо.

РЕДАКТИРОВАТЬ - Извините, чтобы уточнить, я имею в виду, что всплывающее окно содержит фактические поля ввода и кнопку Отправить также. Я видел пример jQuery для этого, но он включает в себя много файлов .js для реализации. Я ищу "самое легкое" самое основное всплывающее окно для ввода и отправки имени / значения paisr на сервер.

Answer 1

Создайте HTML-форму и используйте jquery для публикации / отправки

http://jquery.malsup.com/form/

http://api.jquery.com/jQuery.post/

редактирование: Вы можете сделать это просто в одном файле .js. Все, что вам нужно сделать, это добавить в ваш проект форму .htm, добавить нужные поля ввода. Затем ссылайтесь на эти поля в вашем .js.

например, это HTML-форма:

<table>
  <td><input type="text" maxlength="50" id="EditUserFName" style="width:220px;" /></td>
     </tr>  
 <tr>
      <td>Last Name:</td>
      <td><input type="text" maxlength="50" id="EditUserLName" style="width:220px;" /></td> 
 </tr>
</table>

ваш файл .js ...

function CallService(method, jsonParameters, successCallback, errorCallback){
if (errorCallback == undefined)
{
    errorCallback = function(xhr)
    {
        if (xhr.status == 501)
        {
            alert(xhr.statusText);
        }
        else
        {
            alert("Unexpected Error");
        }
    }
}

$.ajax({
    type: "POST",
    url: method,
    data: jsonParameters,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: successCallback,
    error: errorCallback
});}


function SaveEvent(onSaveCallback){
var fName = $("#EditUserFName").val()
var lName = $("#EditUserLName").val(),

CallService("ServiceLayer/Manager.asmx/SaveEvent", JSON.stringify(fName, lName), function()
{       
    if (onSaveCallback != undefined)
    {
        onSaveCallback();
    }        
}}

это основы того, как это сделать .. очевидно, вам нужна некоторая проверка и некоторые другие функции

Answer 2

Try prototype based popup windows 
http://livepipe.net/

Традиционно всплывающее окно используется для отправки данных с использованием AJax. но я работал в проекте, где я загружаю всплывающее окно, используя Ajax, но отправка данных на сервер просто не ajax