Đang chuẩn bị liên kết để tải về tài liệu:
Tương tác giữa PHP và jQuery - part 30

CHAPTER 8 ■ EDITING THE CALENDAR WITH AJAX AND JQUERY var action = "edit_event"; // Loads the editing form and displays it $.ajax({ type: "POST", url: processFile, data: "action="+action, success: function(data){ // Hides the form var form = $(data).hide(), // Make sure the modal window exists modal = fx.initModal(); // Call the boxin function to create // the modal overlay and fade it in fx.boxin(null, modal); // Load the form into the window, // fades in the content, and adds // a class to the form form .appendTo(modal) .addClass("edit-form") .fadeIn("slow"); }, error: function(msg){ alert(msg); } }); }); Determining the Form Action In the. | CHAPTER 8 EDITING THE CALENDAR WITH AJAX AND JQUERY var action edit_event Loads the editing form and displays it .ajax type POST url processFile data action action success function data Hides the form var form data .hide Make sure the modal window exists modal fx.initModal Call the boxin function to create the modal overlay and fade it in fx.boxin null modal Load the form into the window fades in the content and adds a class to the form form .appendTo modal .addClass edit-form .fadeIn slow error function msg alert msg Determining the Form Action In the editing controls displayed for individual events the button names describe the action taken by the button e.g. edit_event for the Edit This Event button and delete_event for the Delete This Event button . These buttons will be used by ajax.inc.php as the action for the submission. Because the event creation button doesn t have a button name you need to keep a default value edit_event . To access the name of the clicked button you ll use a property of the event object called target. This property contains a reference to the element that triggered the event. Use jQuery to select the event target and use .attr to retrieve its name. Now modify the event handler using the following bold code Displays the edit form as a modal window .admin-options form .admin .live click function event Prevents the form from submitting event.preventDefault 291 CHAPTER 8 EDITING THE CALENDAR WITH AJAX AND JQUERY Sets the action for the form submission var action event.target .attr name edit_event Loads the editing form and displays it .ajax type POST url processFile data action action success function data Hides the form var form data .hide Make sure the modal window exists modal fx.initModal Call the boxin function to create the modal overlay and fade it in fx.boxin null modal Load the form into the window fades in the content and adds a class to the form form .appendTo modal .addClass edit-form .fadeIn slow error function msg alert msg .