I created the Modal Form where it captures the user id information and a date stamp (date()).
Now I want to submit to update an item list. Below is the code. Everything is working as it should, however, the only thing it's not doing is submitting to the list. In the area of code below (below "//this is where I wanted to update using the text are") is where I thought it would update. Below is the Code:
<script>
$( function() {
var dialog, form,
emailRegex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/,
email = $( "#email" ),
allFields = $( [] ).add( email ),
tips = $( ".validateTips" );
function updateTips( t ) {
tips
.text( t )
.addClass( "ui-state-highlight" );
setTimeout(function() {
tips.removeClass( "ui-state-highlight", 1500 );
}, 500 );
}
function checkLength( o, n, min, max ) {
if ( o.val().length > max || o.val().length < min ) {
o.addClass( "ui-state-error" );
updateTips( "Length of " + n + " must be between " +
min + " and " + max + "." );
return false;
} else {
return true;
}
}
function checkRegexp( o, regexp, n ) {
if ( !( regexp.test( o.val() ) ) ) {
o.addClass( "ui-state-error" );
updateTips( n );
return false;
} else {
return true;
}
}
function addUser() {
var valid = true;
allFields.removeClass( "ui-state-error" );
valid = valid && checkLength( email, "email", 6, 80 );
valid = valid && checkRegexp( email, emailRegex, "eg. [email protected]" );
if ( valid ) {
$( "#users tbody" ).append( "<tr>" +
"<td>" + email.val() + "</td>" +
"</tr>" );
dialog.dialog( "close" );
}
return valid;
}
dialog = $( "#dialog-form" ).dialog({
autoOpen: false,
height: 400,
width: 350,
modal: true,
buttons: {
"Sign": addUser,
Cancel: function() {
dialog.dialog( "close" );
}
},
/*close: function() {
form[ 0 ].reset();
allFields.removeClass( "ui-state-error" );
}*/
});
form = dialog.find( "form" ).on( "submit", function( event ) {
event.preventDefault();
addUser();
});
$( "#create-user" ).button().on( "click", function() {
dialog.dialog( "open" );
});
}
);
</script>
<div id="dialog-form" title="Employee Signature">
<p class="validateTips">Verify your Information</p>
<script type="text/javascript">
var loginName = "";
var userid = _spPageContextInfo.userId;
var da = new Date();
var urlParam=GetUrlKeyValue("ID");
GetCurrentUser();
function GetCurrentUser() {
var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/getuserbyid(" + userid + ")";
var requestHeaders = { "accept" : "application/json;odata=verbose" };
$.ajax({
url : requestUri,
contentType : "application/json;odata=verbose",
headers : requestHeaders,
success : onSuccess,
error : onError
});
}
function onSuccess(data, request) {
var loginName = data.d.Title;
var loginName = loginName + " - Signed on " + da;
var edidpObject = {
loginObj: function () {
return loginName;
}
}
cacedi = edidpObject.loginObj();
document.getElementById("edipiCac").value = cacedi;
}
function onError(error) {
alert(error);
}
</script>
<form>
<fieldset>
<label for="email">Signature - List Item ID Number: <span id="dispID"></span></label><br />
<textarea name="email" id="edipiCac" value="" class="text ui-widget-content ui-corner-all" cols="40" rows="4" readonly></textarea>
<input type="submit" tabindex="-1" onclick="updateListItem();" style="position:absolute; top:-1000px">
</fieldset>
</form>
<script>
var urlParamForm=GetUrlKeyValue("ID");
//this is where I wanted to update using the text are
//this is where I wanted to update using the text are
//this is where I wanted to update using the text are
document.getElementById("dispID").innerHTML=urlParamForm;
function updateListItem() {
var clientContext = new SP.ClientContext.get_current();
var oList = clientContext.get_web().get_lists().getByTitle("sp-forms-form2");
var x = document.getElementById("myForm").elements.namedItem("email).value;
this.oListItem = oList.getItemById(urlParamForm);
oListItem.set_item("preference", x);
if (confirm("Click Ok to Continue with change(s) or cancel!")) {
oListItem.update();
clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
} else {
alert("No change in Item.");
}
}
function onQuerySucceeded() {
alert("Item updated!");
}
function onQueryFailed(sender, args) {
alert("Request failed. " + args.get_message() + "\n" + args.get_stackTrace());
}
</script>
</div>
