I have the following code which gives me a syntax error - unterminated string constant.I've matched up the quotes can't seem to spot an issue. Any ideas? It works fine, the syntax error is just annoying.
<input type="button" class="my-button" value="" name="back" onclick="location.href='#Url.Action(Model.Back.Step.ToString(), "MyController")'" />
You can rewrite it like this:
<input type="button" class="my-button" value="" name="back"
onclick="#("location.href='"
+ Url.Action(Model.Back.Step.ToString(), "MyController")
+ "'")" />
Use an actionlink instead. This one creates a nice bootstrap button:
#Html.ActionLink("Cancel", "Index", "Home", null, new { #class = "btn btn-default" })
Related
I am doing an MVC tutorial and have hit a problem.
I changed a working view from using Html.BeginForm to Ajax.BeginForm. But the form is not submitting.
Per my research I verified that ClientValidationEnabled and UnobtrusiveJavaScriptEnabled are both set to true in web.config. I do have the most recent version of jquery.unobtrusive-ajax,js and jquery refrenced. But still no joy.
I firebugged jquery.unobtrusive-ajax to see what it was doing. It is setting itself up on page load. But no functions are called when I click the submit button.
Here is a snippet from View Source to show how the form tag is begin set up:
<div id="formSection">
<h3>Having trouble? Send me a message</h3>
<form action="/Home/Contact" data-ajax="true" data-ajax-method="post" data-ajax-mode="replace" data-ajax-update="#formSection" id="form0" method="post">
</form>
<textarea name="message"></textarea>
<input type="submit" value="send" />
</div>
My error became apparent while asking the question. I was cleaning up the bad formatting of the HTML when I saw the end form tag was before the submit button!
I had an error in my Razor code.
#Using (Ajax.BeginForm("Contact", "Home", New AjaxOptions With {.HttpMethod = "post", .InsertionMode = InsertionMode.Replace, .UpdateTargetId = "formSection"}))
End Using
<textarea name="message"></textarea>
<input type="submit" value="send" />
Putting the End Using right after the Using closed the block of course, so the input element never got into the form.
Correct syntax:
#Using (Ajax.BeginForm("Contact", "Home", New AjaxOptions With {.HttpMethod = "post", .InsertionMode = InsertionMode.Replace, .UpdateTargetId = "formSection"}))
#<textarea name="message"></textarea>
#<input type="submit" value="send" />
End Using
It would have been nice if the generated code was formatted well, I would have seen the end form tag location much sooner.
Hopefully I help avoid a few head slaps.
i have a contact form on http://daniloportal.com/NPC2/contact.html
Now this ajax script works very well, but i have other contact forms that i would like to use the same script for. so when i tried to create mulitple instances of the script, i noticed it stopped working because the ID name is not specifically ajax-contact-form. take a look at the code:
<form id="ajax-contact-form" action="">
<input type="text" name="name" value="Name *" title="Name *" />
<input type="text" name="email" value="Email " title="Email *" />
<input type="text" name="email" value="Email *" title="Email *" />
<textarea name="message" id="message" title="Message *">Message *</textarea>
<div class="clear"></div>
<input type="reset" class="btn btn_clear" value="Clear form" />
<input type="submit" class="btn btn_blue btn_send" value="Send message!" />
<div class="clear"></div>
</form>
and heres the JS
$("#ajax-contact-form").submit(function() {
var str = $(this).serialize();
$.ajax({
type: "POST",
url: "contact_form/contact_process.php",
data: str,
success: function(msg) {
// Message Sent - Show the 'Thank You' message and hide the form
if(msg == 'OK') {
result = '<div class="notification_ok">Your message has been sent. Thank you!</div>';
$("#fields").hide();
} else {
result = msg;
}
$('#note').html(result);
}
});
return false;
});
Now if i were to switch that ID name on both and MATCH them, the script stops working- Theoretically it should work- not sure whats wrong with this.
as always any help is appreciated, thanks!
If you are trying to access two elements with the same id with jQuery - nothing gonna happen. Each element must have a unique identifier, otherwise you should use classes.
However, can you give us the markup of another form?
I'm currently implementing a blankContent SimpleDialog for jQuery Mobile.
This is the html:
<li>
<a href="#page1" id="searchdialog" data-theme="" data-icon="search">Search Routes
</a>
</li>
And this is the jQuery:
<script type="text/javascript">
$(document).delegate('#searchdialog', 'click', function() {
$('<div>').simpledialog2({
mode: 'blank',
headerText: 'Route Search',
headerClose: true,
blankContent :
'<div id="content" data-role="content"><label>Enter Your Search:</label><div data-role="fieldcontain"><fieldset data-role="controlgroup">' +
'<label for="textinput7">Start</label><input id="start" placeholder="" value="" type="text"/></fieldset></div>'+
'<div data-role="fieldcontain"><fieldset data-role="controlgroup"><label for="textinput9">End</label>'+
'<input id="end" placeholder="" value="" type="text" /></fieldset></div>'+
'<a data-role="button" data-transition="fade" data-theme="b" href="#page6" data-icon="search" data-iconpos="left" onclick="alert($("#start").val(),$("#end").val())">Search</a>'
})
});
</script>
I can not for the life of me figure out what is causing this error:
Uncaught SyntaxError: Unexpected token }
The error only occurs when the Search Routes link is clicked, which leads me to believe it's an error in the jquery. Interestingly, if I make it
onclick="alert()"
instead of
onclick="alert($("#start").val(),$("#end").val())"
Then it works, but I need to have a varient of the other along the lines of:
onclick="location.href = "/search/?start=" + $("#start").val() + "&end=" + $("#end").val()"
Thoughts on how I can accomplish this? Any quick and dirty solution will work. Thanks
your line:
'onclick="alert($("#start").val(),$("#end").val())"'
is causing the errors. You have conflicting quotes in your onclick attribute ( and a non-string comma! )
You would be better off creating a hidden / display:none element w/this hard coded info in it then simply referring to it.
OR assigning a handler # time that html is created (similar to your already delegated handler )
edit: Basically take this:
'<a data-role="button" data-transition="fade" data-theme="b" href="#page6" data-icon="search" data-iconpos="left" onclick="alert($("#start").val(),$("#end").val())">Search</a>'
and do this instead:
'<a class="some-wonky-alert" data-role="button" data-transition="fade" data-theme="b" href="#page6" data-icon="search" data-iconpos="left" >Search</a>'
$('a .some-wonky-alert').on('click', function()
{
alert($("#start").val() + $("#end").val());
});
Season as delegated # your convenience
edit2 : Or of course you could try to escape the quotes - but while that might work - it won't solve the bad practices being engaged in :)
I want to code a line like this in my mvc view:
<input type="button" id="Show" name="Show" onclick="javascript: AjaxPostAndProcess('myController/MyAction',{input1: ($('#formId').find( 'input[name="input1"]').val()})" />
but the doublequotes around "input1" are inside the singlequotes enclosing the parm to .find, and it's all inside the doublequotes of the onclick expression. Is there any way to escape this to get it to work?
I would do it differently:
<input type="button" id="Show" name="Show" />
<script>
$('#Show').click(function () {
AjaxPostAndProcess('myController/MyAction', {
input1: $('#formId').find( 'input[name="input1"]').val()
});
}
</script>
Keeping it unobtrusive. But to answer you question you could replace them with "
I have two input control and and one Html.ActionLink control on my page. How do i pass the value of these input control as parameter to Controller Action.
<input id="txtName" value="MyName" type="Text"/>
<input id="txtAge" value="20" type="Text"/>
<%: Html.ActionLink("Add", "AddName", "EditProfile", new{ --- What to Pass--}, new { #Class = "openDialog", data_dialog_id = "AddCarrierDialog", data_dialog_title = "Add Carrier" })%>
My Controller take two parameter to show detail
[HttpPost]
public ActionResult AddName(string Name, int Age)
{
return PartialView("ShowData");
}
I am not able to pass txtName and TxtAge values to controller Action. Can Anyone help me out.
Thanks in Advance!!!
You will need javascript in order to achieve that. A better approach would be to use an html <form> instead of an action link as it will automatically send the values that the user entered in the input fields to the server:
<% using (Html.BeginForm("AddName", "EditProfile", FormMethod.Post, new { #class = "openDialog", data_dialog_id = "AddCarrierDialog", data_dialog_title = "Add Carrier" })) { %>
<input id="txtName" value="MyName" type="text" />
<input id="txtAge" value="20" type="text" />
<input type="submit" value="Add" />
<% } %>