修改
我需要对此内的控制器进行jquery ajax调用，它会出错，但不会告诉我错误是什么。它只显示内部服务器错误。
$.ajax({
url: "<%=editNotificationURL%>",
type: 'POST',
data: queryString
}).done(function(json){
console.log(json);
//alert("json::"+json);
//alert("Success!");
}).fail(function(jqXHR, textStatus, error) {
//alert("OOPS! An error occured while processing your request. Please try again after sometime.");
alert("Post error: " + error);
});
错误讯息：
urldecoder illegal hex characters in escape (%) pattern - for input String "=e"
原始修正：
我有一个由javascript创建的动态表单
var editForm = document.createElement("form");
editForm.setAttribute('id',id + "_Edit_Form");
editForm.setAttribute('class',"subform");
editForm.setAttribute('role',"form");
...
var messageField = document.createElement("div");
messageField.setAttribute('class',"field");
var messageLabel = document.createElement("label");
messageLabel.setAttribute('for',id+"description");
messageLabel.innerHTML = "Description:";
var messageTextarea = document.createElement("textarea");
messageTextarea.setAttribute('id',id+"_message");
messageTextarea.innerHTML = description ;
messageField.appendChild(messageLabel);
messageField.appendChild(messageTextarea);
...
var buttonsDiv = document.createElement("div");
buttonsDiv.setAttribute('class',"qmat-buttons");
//Create the Save button
var editSave = document.createElement("input");
editSave.setAttribute('type',"submit");
editSave.setAttribute('id',id+"_save");
editSave.setAttribute('class',"qmat-button action-blue-button");
editSave.setAttribute('value',"Save");
//editSave.innerHTML = "Save";
editSave.onclick = function () {
//alert("edit"+messageTextarea.value);
var formName = editForm.getAttribute('id');
var queryString = $('#'+formName).serialize();
var a = $('#'+formName).length;
alert("query::"+formName+"::"+a+"::"+queryString);
};
...
editDiv.appendChild(editForm);
//Append the fieldset to the form
editForm.appendChild(editFormFieldset);
//Append the legend to the fieldset
editFormFieldset.appendChild(editFormFieldsetLegend);
//Appends the Message field
editFormFieldset.appendChild(messageField);
//Appends the Start Date & Time group
editFormFieldset.appendChild(startGroup);
//Append the End Date & Time group
editFormFieldset.appendChild(endGroup);
//Append the status field
editFormFieldset.appendChild(statusField);
//Append the buttons to the form
editForm.appendChild(buttonsDiv);
//Returns the Edit form
return editDiv;
现在我需要将该表单中的值传递给Json。所以我正在尝试这样的事情：
editSave.onclick = function () {
var formName = editForm.getAttribute('id');
var queryString = $('#formName').serialize();
alert("query::"+queryString);
};
但queryString为空。看起来我错过了一些小事。请帮忙。感谢
答案 0 :(得分：1)
您需要正确连接字符串
var formName = editForm.getAttribute('id');
var queryString = $('#'+formName).serialize();
另外，请确保您的表单字段具有name属性，以使serialize()正常工作
var queryString = $('#299_Edit_Form').serialize();
console.log("query::" + queryString);<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form id="299_Edit_Form" class="subform" role="form">
<fieldset id="299_Edit_Form_Fieldset" class="main-fieldset">
<legend class="legend">Notification ID: <strong>299</strong>
</legend>
<div class="field">
<label for="299description">Description:</label>
<textarea name="299_message" id="299_message">test 1</textarea>
</div>
<div class="group">
<div class="field">
<label for="299_start_date">Start Date:</label>
<input type="text" name="299_start_date" id="299_start_date" value="6/2/2015" class="date-picker">
</div>
<div class="field">
<label for="299_start_time">Start Time:</label>
<select name="299_start_time" id="299_start_time">
<option value="12:00 AM">12:00 AM</option>
<option value="12:15 AM">12:15 AM</option>
<option value="12:30 AM">12:30 AM</option>
<option value="12:45 AM">12:45 AM</option>
<option value="1:00 AM">1:00 AM</option>
<option value="1:15 AM">1:15 AM</option>
<option value="1:30 AM">1:30 AM</option>
<option value="1:45 AM">1:45 AM</option>
<option value="2:00 AM">2:00 AM</option>
<option value="2:15 AM">2:15 AM</option>
<option value="2:30 AM">2:30 AM</option>
<option value="2:45 AM">2:45 AM</option>
<option value="3:00 AM">3:00 AM</option>
<option value="3:15 AM">3:15 AM</option>
<option value="3:30 AM">3:30 AM</option>
<option value="3:45 AM">3:45 AM</option>
<option value="4:00 AM">4:00 AM</option>
<option value="4:15 AM">4:15 AM</option>
<option value="4:30 AM">4:30 AM</option>
<option value="4:45 AM">4:45 AM</option>
<option value="5:00 AM">5:00 AM</option>
<option value="5:15 AM">5:15 AM</option>
<option value="5:30 AM">5:30 AM</option>
<option value="5:45 AM">5:45 AM</option>
<option value="6:00 AM">6:00 AM</option>
<option value="6:15 AM">6:15 AM</option>
<option value="6:30 AM">6:30 AM</option>
<option value="6:45 AM">6:45 AM</option>
<option value="7:00 AM">7:00 AM</option>
<option value="7:15 AM">7:15 AM</option>
<option value="7:30 AM">7:30 AM</option>
<option value="7:45 AM">7:45 AM</option>
<option value="8:00 AM">8:00 AM</option>
<option value="8:15 AM">8:15 AM</option>
<option value="8:30 AM">8:30 AM</option>
<option value="8:45 AM">8:45 AM</option>
<option value="9:00 AM">9:00 AM</option>
<option value="9:15 AM">9:15 AM</option>
<option value="9:30 AM">9:30 AM</option>
<option value="9:45 AM">9:45 AM</option>
<option value="10:00 AM">10:00 AM</option>
<option value="10:15 AM">10:15 AM</option>
<option value="10:30 AM">10:30 AM</option>
<option value="10:45 AM">10:45 AM</option>
<option value="11:00 AM">11:00 AM</option>
<option value="11:15 AM">11:15 AM</option>
<option value="11:30 AM">11:30 AM</option>
<option value="11:45 AM">11:45 AM</option>
<option value="12:00 PM">12:00 PM</option>
<option value="12:15 PM">12:15 PM</option>
<option value="12:30 PM">12:30 PM</option>
<option value="12:45 PM">12:45 PM</option>
<option value="1:00 PM">1:00 PM</option>
<option value="1:15 PM">1:15 PM</option>
<option value="1:30 PM">1:30 PM</option>
<option value="1:45 PM">1:45 PM</option>
<option value="2:00 PM">2:00 PM</option>
<option value="2:15 PM">2:15 PM</option>
<option value="2:30 PM">2:30 PM</option>
<option value="2:45 PM">2:45 PM</option>
<option value="3:00 PM">3:00 PM</option>
<option value="3:15 PM">3:15 PM</option>
<option value="3:30 PM">3:30 PM</option>
<option value="3:45 PM">3:45 PM</option>
<option value="4:00 PM">4:00 PM</option>
<option value="4:15 PM">4:15 PM</option>
<option value="4:30 PM">4:30 PM</option>
<option value="4:45 PM">4:45 PM</option>
<option value="5:00 PM">5:00 PM</option>
<option value="5:15 PM">5:15 PM</option>
<option value="5:30 PM">5:30 PM</option>
<option value="5:45 PM">5:45 PM</option>
<option value="6:00 PM">6:00 PM</option>
<option value="6:15 PM">6:15 PM</option>
<option value="6:30 PM">6:30 PM</option>
<option value="6:45 PM">6:45 PM</option>
<option value="7:00 PM" selected="selected">7:00 PM</option>
<option value="7:15 PM">7:15 PM</option>
<option value="7:30 PM">7:30 PM</option>
<option value="7:45 PM">7:45 PM</option>
<option value="8:00 PM">8:00 PM</option>
<option value="8:15 PM">8:15 PM</option>
<option value="8:30 PM">8:30 PM</option>
<option value="8:45 PM">8:45 PM</option>
<option value="9:00 PM">9:00 PM</option>
<option value="9:15 PM">9:15 PM</option>
<option value="9:30 PM">9:30 PM</option>
<option value="9:45 PM">9:45 PM</option>
<option value="10:00 PM">10:00 PM</option>
<option value="10:15 PM">10:15 PM</option>
<option value="10:30 PM">10:30 PM</option>
<option value="10:45 PM">10:45 PM</option>
<option value="11:00 PM">11:00 PM</option>
<option value="11:15 PM">11:15 PM</option>
<option value="11:30 PM">11:30 PM</option>
<option value="11:45 PM">11:45 PM</option>
</select>
</div>
</div>
<div class="group">
<div class="field">
<label for="299_end_date">End Date:</label>
<input type="text" name="299_end_date" id="299_end_date" value="6/29/2015" class="date-picker">
</div>
<div class="field">
<label for="299_end_time">End Time:</label>
<select name="299_end_time" id="299_end_time">
<option value="12:00 AM">12:00 AM</option>
<option value="12:15 AM">12:15 AM</option>
<option value="12:30 AM">12:30 AM</option>
<option value="12:45 AM">12:45 AM</option>
<option value="1:00 AM">1:00 AM</option>
<option value="1:15 AM">1:15 AM</option>
<option value="1:30 AM">1:30 AM</option>
<option value="1:45 AM">1:45 AM</option>
<option value="2:00 AM">2:00 AM</option>
<option value="2:15 AM">2:15 AM</option>
<option value="2:30 AM">2:30 AM</option>
<option value="2:45 AM">2:45 AM</option>
<option value="3:00 AM">3:00 AM</option>
<option value="3:15 AM">3:15 AM</option>
<option value="3:30 AM">3:30 AM</option>
<option value="3:45 AM">3:45 AM</option>
<option value="4:00 AM">4:00 AM</option>
<option value="4:15 AM">4:15 AM</option>
<option value="4:30 AM">4:30 AM</option>
<option value="4:45 AM">4:45 AM</option>
<option value="5:00 AM">5:00 AM</option>
<option value="5:15 AM">5:15 AM</option>
<option value="5:30 AM">5:30 AM</option>
<option value="5:45 AM">5:45 AM</option>
<option value="6:00 AM">6:00 AM</option>
<option value="6:15 AM">6:15 AM</option>
<option value="6:30 AM">6:30 AM</option>
<option value="6:45 AM">6:45 AM</option>
<option value="7:00 AM">7:00 AM</option>
<option value="7:15 AM">7:15 AM</option>
<option value="7:30 AM">7:30 AM</option>
<option value="7:45 AM">7:45 AM</option>
<option value="8:00 AM">8:00 AM</option>
<option value="8:15 AM">8:15 AM</option>
<option value="8:30 AM">8:30 AM</option>
<option value="8:45 AM">8:45 AM</option>
<option value="9:00 AM">9:00 AM</option>
<option value="9:15 AM">9:15 AM</option>
<option value="9:30 AM">9:30 AM</option>
<option value="9:45 AM">9:45 AM</option>
<option value="10:00 AM">10:00 AM</option>
<option value="10:15 AM">10:15 AM</option>
<option value="10:30 AM">10:30 AM</option>
<option value="10:45 AM">10:45 AM</option>
<option value="11:00 AM">11:00 AM</option>
<option value="11:15 AM">11:15 AM</option>
<option value="11:30 AM">11:30 AM</option>
<option value="11:45 AM">11:45 AM</option>
<option value="12:00 PM">12:00 PM</option>
<option value="12:15 PM">12:15 PM</option>
<option value="12:30 PM">12:30 PM</option>
<option value="12:45 PM">12:45 PM</option>
<option value="1:00 PM">1:00 PM</option>
<option value="1:15 PM">1:15 PM</option>
<option value="1:30 PM">1:30 PM</option>
<option value="1:45 PM">1:45 PM</option>
<option value="2:00 PM">2:00 PM</option>
<option value="2:15 PM">2:15 PM</option>
<option value="2:30 PM">2:30 PM</option>
<option value="2:45 PM">2:45 PM</option>
<option value="3:00 PM">3:00 PM</option>
<option value="3:15 PM">3:15 PM</option>
<option value="3:30 PM">3:30 PM</option>
<option value="3:45 PM">3:45 PM</option>
<option value="4:00 PM">4:00 PM</option>
<option value="4:15 PM">4:15 PM</option>
<option value="4:30 PM">4:30 PM</option>
<option value="4:45 PM">4:45 PM</option>
<option value="5:00 PM">5:00 PM</option>
<option value="5:15 PM">5:15 PM</option>
<option value="5:30 PM">5:30 PM</option>
<option value="5:45 PM">5:45 PM</option>
<option value="6:00 PM">6:00 PM</option>
<option value="6:15 PM">6:15 PM</option>
<option value="6:30 PM">6:30 PM</option>
<option value="6:45 PM">6:45 PM</option>
<option value="7:00 PM" selected="selected">7:00 PM</option>
<option value="7:15 PM">7:15 PM</option>
<option value="7:30 PM">7:30 PM</option>
<option value="7:45 PM">7:45 PM</option>
<option value="8:00 PM">8:00 PM</option>
<option value="8:15 PM">8:15 PM</option>
<option value="8:30 PM">8:30 PM</option>
<option value="8:45 PM">8:45 PM</option>
<option value="9:00 PM">9:00 PM</option>
<option value="9:15 PM">9:15 PM</option>
<option value="9:30 PM">9:30 PM</option>
<option value="9:45 PM">9:45 PM</option>
<option value="10:00 PM">10:00 PM</option>
<option value="10:15 PM">10:15 PM</option>
<option value="10:30 PM">10:30 PM</option>
<option value="10:45 PM">10:45 PM</option>
<option value="11:00 PM">11:00 PM</option>
<option value="11:15 PM">11:15 PM</option>
<option value="11:30 PM">11:30 PM</option>
<option value="11:45 PM">11:45 PM</option>
</select>
</div>
</div>
<div class="field">
<label for="299_status">Status:</label>
<select name="299_status" id="299_status">
<option value="true" selected="selected">Active</option>
<option value="false">Inactive</option>
</select>
</div>
</fieldset>
<div class="buttons">
<input type="submit" id="299_save" class="button action-blue-button" value="Save" on click="save()">
<input type="reset" id="299_cancel" class="button action-blue-button" value="Cancel">
</div>
</form>