Trying to render the page, and trigger a notification on button click. I have set this up to just do a pop up for now, since its an internal application for the higher ups.
The button in question is a simple razor syntax html helper with an onclick event to return a confirm dialog. However it seems I am unable to render the item variable for this.
#Html.ActionLink("Delete", "Delete", new { id = item.Id },
new { #class = "btn btn-warning",
onclick = "return confirm('WARNING: Delete #item.Id?');" })
this fails to render item.Id (the output of the surrounding foreach statement but instead outputs the string literal "#item.Id"
#Html.ActionLink("Delete", "Delete", new { id = item.Id },
new { #class = "btn btn-warning",
onclick = "return confirm('WARNING: Delete ' + item.Id + '?');" })
This renders the variable but since it is not a javascript variable it renders as "Delete undefined ?"
How can I use a variable from the foreach outside of the javascript passed into this dialog, to make the message more descriptive.
I was able to solve my own problem using string.Format in C#.
#Html.ActionLink("Delete", "Delete", new { id = item.Id },
new { #class = "btn btn-warning",
onclick = string.Format("return confirm('WARNING: Delete {0}?');", item.Id) })
You aren't closing your string properly. Try the following:
onclick = "return confirm('WARNING: Delete " + item.Id + "?');"
Your error is saying the javascript item item.Id is not defined because item is probably not defined in your js scripts.
Related
I'm just getting into MVC, so I'm not sure this can even be accomplished using an ActionLink. But what I'm trying to do is to have an Html.ActionLink that you can assign both a CSS class AND a return confirm.
I've gotten this to work:
#Html.ActionLink("Delete", "Delete", "NWS", new { recordId = Model.Id }, new { #class = "btn btn-danger configDelete" })
And I've gotten this to work:
#Html.ActionLink("Delete", "Delete", "NWS", new { recordId = Model.Id }, new { onclick = "return confirm('Are you sure you want to delete this config?')" })
But when I try adding both like so,
#Html.ActionLink("Delete", "Delete", "NWS", new { recordId = Model.Id }, new { #class = "btn btn-danger configDelete" }, new { onclick = "return confirm('Are you sure you want to delete this config?')" })
I get a syntax error that reads, "There is no argument given that corresponds to the required formal parameter 'routeValues' of 'IHtmlHelper.ActionLink(string, string, string, string, string, string, object, object)"
I've tried putting the return confirm before the CSS class too, but it didn't matter. Is this possible to do with an ActionLink? If not, is there something out there where I can do this?
Instead of separating them into their own objects, combine them into one object:
new { #class = "btn btn-danger configDelete", onclick = "return confirm('Are you sure you want to delete this config?')" }
Note that they're both just attributes for the resulting HTML element. You can add as many as you like. They just all need to be a part of the same object passed to the HTML helper method.
I try with MVC and i don't know how to by pass value of dropdownlist to event onchange .
#Html.DropDownList("cblist_id", (IEnumerable<SelectListItem>)ViewBag.listproduct, new { size = 5, #class = "form-control", onchange = "GetProduct(" + this.value + ", 123)" })
And this is function in script
function GetProduct(productid, categoryid) {
////do something
}
I get this error for sample
Compiler Error Message: CS1061: 'ASP._Page_Areas_Users_Views_Permit_GrandPermit_cshtml' does not contain a definition for 'value' and no extension method 'value' accepting a first argument of type 'ASP._Page_Areas_Users_Views_Permit_GrandPermit_cshtml' could be found (are you missing a using directive or an assembly reference?)
So ,i think the problem when i try get value of dropdownlist.
The this.value here refer to the context of server-side C#, you need to bind the this of the dropdown list on JavaScript onchange = "GetProduct(this, 123)"
#Html.DropDownList("cblist_id", (IEnumerable<SelectListItem>)ViewBag.listproduct, new { size = 5, #class = "form-control", onchange = "GetProduct(this, 123)" })
and with your function, GetProduct do the following
function GetProduct(drp, number){
$(drp).val()
// or
drp.value
}
and something else to pass the value directly like so
#Html.DropDownList("cblist_id", (IEnumerable<SelectListItem>)ViewBag.listproduct, new { size = 5, #class = "form-control", onchange = "GetProduct(this.value, 123)" })
function GetProduct(selectedValue, number){
}
Here i am using anchor tag for this class is not applying.And this is my code
<td> #CAH.BookingID</td>
Previously i used
<td> #Html.ActionLink((string)CAH.BookingID, "ViewServiceDetails", "ServiceConsumer", new { BookingID = CAH.BookingID }, new { #class = "btn btn-link", data_toggle = "modal", data_target = "#ViewServiceDetails" })</td>
but iam getting error for second one
You're going about this wrong.
You're getting mixed up with 'normal' HTML, and helpers.
You don't pass in your #class attributes to the anonymous object passed to Url.Action
Just use normal HTML in conjunction with Url.Action if you want:
You're going about this wrong.
You're getting mixed up with 'normal' HTML, and helpers.
You don't pass in your #class attributes to the anonymous object passed to Url.Action
Just use normal HTML in conjunction with Url.Action if you want:
<td>
<a href="#Url.Action("ViewServiceDetails", "ServiceConsumer", new { BookingID = CAH.BookingID })"
class="btn btn-link"
data-toggle="modal"
data-target="#ViewServiceDetails">
#CAH.BookingID
</a>
</td>
You could use Html.ActionLink as described here
#Html.ActionLink(CAH.BookingID, // <-- Text of link.
"ServiceConsumer", // <-- Controller Name.
"ViewServiceDetails", // <-- ActionMethod
new { BookingID = CAH.BookingID }, // <-- Route arguments.
new { #class="btn btn-link", data_toggle = "modal", data_target = "#ViewServiceDetails" } // <-- htmlArguments
)
Below is my Webgrid column "Actions" where i have placed Edit and Delete options. I want to give one confirmation message before going to controller. Below is code which is not working for me
grid.Column(header: "Actions", format: (item) =>
new HtmlString(
Html.ActionLink("Edit", "GetEditRecord", new { id = item.id }, new {#class = "ActionEdit"}).ToString() +
Html.ActionLink("Delete", "Delete", new { id = item.id }, new {#class = "ActionDelete", OnClientClick="test();"} ) .ToString()
))
And below is the Javascript function
<script language="javascript">
function test() {
alert("Hello\nHow are you?");
//changeasset.class = "cd-panel from-right AddAssetForm is-visible";
}
</script>
Please Help.
Instead of trying to bind a click event listener in the ActionLink with the 'OnClientClick' binding, I would bind the listener in the client code.
var deleteLinks = document.querySelectorAll('.ActionDelete');
Array.prototype.forEach.call(deleteLinks, function(link){
link.addEventListener('click', test, false);
});
Use this function,
function test(){
confirm('do you want to delete this');
}
I'm developing an ASP.NET MVC4 application and have started using jQuery actionlinks.
However when I run the following Razor code (and click the view ticket actionlink) I get a generic jQuery error (twice) saying that an empty string was passed to getElementById().
I have no idea where this error is happening since firefox merely links to the jQuery code.
This is my Razor code: (I know the js functions show and hideticket are empty but that is to simplify the code):
<script>
function ShowTicket(id) {
$("#viewTicketButton" + id).hide();
$("#hideTicketButton" + id).show();
$("#viewTicket").show();
}
function HideTicket(id) {
$("#viewTicketButton" + id).show();
$("#hideTicketButton" + id).hide();
$("#viewTicket").hide();
}
</script>
<h3>Your tickets</h3>
<table border="1">
<tr>
<td>Title:</td>
<td>Urgency:</td>
<td>Status:</td>
</tr>
#foreach (SupportTicketViewData t in Model.supportTicketViewDataList)
{
<tr>
<td>#t.title</td>
<td>#t.text</td>
<td>#t.status</td>
<td>#Ajax.ActionLink("View Ticket", "ViewTicket", new { id = t.id },
new AjaxOptions
{
HttpMethod = "GET",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "viewTicket",
OnComplete = "ShowTicket(" + t.id +");"
}, new { id = "viewTicket" + t.id })</td>
<td><button id="#Html.Raw("HideTicket" + t.id)" onclick="HideTicket(#t.id);">Hide Ticket</button></td>
</tr>
}
</table>
<div id="viewTicket">
</div>
Also I get a result from the GET request just fine since it get's inserted into the div element however I get 2 errors when debugging in firefox.
Also when I click the viewTicketButton the button doesn't hide as it should.
Warnings 'Empty string passed to getElementById()' occurs when sending form created via Ajax.BeginForm or Ajax.ActionLink with unobtrusive validation turned on.
In my case adding handlers to all events supported by Ajax.BeginForm fixed issue with warnings:
#using (Ajax.BeginForm(“SomeAction”, null, new AjaxOptions() {
OnBegin = “someFunction”,
OnComplete = “ShowTicket”,
OnFailure = “someFunction”,
OnSuccess = “someFunction”
}
....
I believe that this should fix your issue.
More details about issue on my blog post.
I believe you cannot simply do
OnComplete = "ShowTicket(" + t.id +");"
The argument must be a javascript function. If what you want to call is parameterless, you can do
OnComplete = "ShowTicket"
where show ticket is the function object, so this is fine.
In your case however, you've got to pass the ID to ShowTicket. Try the following:
OnComplete = "function() { ShowTicket(" + t.id +"); }"
You will likely have to add the slashes to compensate for the double quotes that you need in the id tag
eg:
Html.Raw("id=\"SomeIdString\"")