I'm new to Razor. I have my web pages complete but I'm at the point where I want to add a print button to my form.
I see where I can add a print button with Asp.Net here but I cannot find where I add it with Razor using MVC.
If there is a thread on this, point me in the right direction, but I didn't find one.
Am I to add a css and use javascript?
Anyone have any suggestions?
I used this answer:
Print ASP.NET Web Form
<input type="button" value="Print Form" onclick="window.print()" />
And it worked perfectly.
You can add any javascript event to any html-helper. For example to add Html-Attribute to Link.
#Html.ActionLink(
"print window",
"Print",
new { id = "someId" },
new { onclick = "window.print();" })
Related
I want to have a pair of radio buttons sitting over an HTML table so that whenever the rb is clicked it will cause the table to rebuild (rebuild the page) by submitting a different URL variable. Is there a way to do this without having to build a form and click a submit button? I'm pretty new to this stuff so please keep any answers basic and/or show samples of code. Thanks!
Html is a Markup Language it will not do the logic for you. that way javascript is there .
<input id="gotogoogle" type="radio" name="name" value="google" checked>
<script>
var radiob = document.getElementById("gotogoogle");
radiob.addEventListener("change", function() {
if(radiob.value == "google")
{
document.location = "http:\\www.gooogle.com"
}
});
</script>
Yes there is, you can use Javascript event binding to help you achieve this. This will get you started. This adds an event binding so when you "change" or click the radio buttons, it can fire an event off.
From here you'd need to research how to rebuild the table data in JS if you don't already know.
$("input[#name='nameofinput']").change(function(){
// Do something interesting here
});
Apologies in advance if this is a dumb question but I'm struggling to get the look and feel I want whilst posting the data I need to the server: s
I've built a simple file upload page using Dropzone.js and am able to upload files to the server. I also want to pass a value from a drop down to the same action method but can only achieve this if my drop down is contained within my dropzone (which I don't want!)
My Page and HTML look like this:
The class="dropzone" defines where the dropzone is and seems to be have to be attached to the action="~/Media/SaveUploadedFile" or the fallback class gets used instead and screws up the layout. So this code gives me the layout I want with the dropdown outside of the dropzone but does not pass the drop down value to my Action Method: (
What am I doing wrong?
Controller method:
public ActionResult SaveUploadedFile(string ContentDirectory)
Try using Html.BeginForm. Place your dropdown inside of the #using tag.
#using (Html.BeginForm("SaveUploadedFile", "Media", FormMethod.Post, new { #class = "dropzone", enctype = "multipart/form-data" }))
{
//Dropdown here
<div class="fallback">
<input type="file" name="file" />
<input type="submit" value="Upload" />
</div>
}
Here's a similar existing post for uploading files in MVC
I have a button here.
<button type="button">#item.StepsToList steps to list</button>
I want the button to go to the page similar to my action below.
/ManageSpaces/id/Overview
I'm trying to do this by putting this action link inside the button.
#Html.ActionLink("Manage Yoga Space and Calendar", "Overview", new {controller = "ManageSpaces", action = "Overview", id = item.YogaSpaceId })
How to make the action link above work inside the button tag?
Buttons aren't for navigation. That's what hyperlinks are for. Putting a non-anchor <a> inside of a <button> isn't valid, either. If your focus is on the look of a button, your choices are to
use a button. Capture the click event and navigate the page using window.location, or
use a hyperlink. Add a CSS framework such as Bootstrap or Foundation, and apply one of their button styles.
Assuming you're familiar with jQuery at all, something like this works for the former point:
<button class="link-button" data-url="/some/url">I navigate somewhere</button>
<script>
$('.link-button').on('click', function(e) {
window.location = $(this).data('url');
});
</script>
For the latter point, Bootstrap and Foundation both have dedicated styles for making just about anything look like a "button":
Bootstrap
I navigate somewhere
Foundation
I navigate somewhere
It's unclear what you're trying to achieve. Do you want to simply navigate to a new page? If so you should use an Html.ActionLink by itself instead of a <button> - that's what they're for. You can style the resulting <a> element to look like a button. If you want to post a form to a new action method, you should specify that in your call to Html.BeginForm, then the button will automatically submit to that action when clicked.
#Html.ActionLink("Manage Yoga Space and Calendar", "Overview", new { controller = "ManageSpaces", action = "Overview", id = item.YogaSpaceId }, new { #class = "btn btn-default " })
My scenario is as follows:
I'm currently using DOJO framework 1.9, with BIRT reporting tool 4.2. BIRT creates a form element (dynamically) in a page, and all input fields (which are from dojo) comes under this form.
And when I try to validate the form (on submit), I can't do that, since the form is not DOJO form.
So, is there any way to convert this HTML form to DOJO form (dijit.form) programmatically?
Or, in general, Is it possible to change a HTML element to DOJO widget programmatically?
You can implement both solutions with dojo. You can create a Dojo widget programmatically or declaratively. You can convert any HTML element to DOJO widget programmatically.
E.g of button created programmatically by Id.
<body class="claro">
<div>
<!--HTML Button element with id ="btn2"-->
<button id="btn2"></button>
</div>
<script>
require(["dijit/form/Button", "dojo/domReady!"], function(Button) {
var button2 = new Button({
iconClass: "dijitIconNewTask",
showLabel: false,
label: "Click Me!", // analogous to title when showLabel is false
onClick: function(){ console.log("Second button was clicked!"); }
}, "btn2");//this is the id of HTML element.
button2.startup();
});
</script>
</body>
View Programmatic Demo Here
In the same way you can create any Dojo widget programmatically.
My client side scripting is rough and I just started with Razor. I haven't been able to find a way to do the following, where I want to inject a model field value within the onclick confirmation message:
#using (Html.BeginForm("Delete", "ManageLocations", new { id = #Model.Location.Id }))
{ <input type="submit" onclick="return confirm('Are you sure you wish to delete #Model.Location.DisplayLocation ?');" value="Delete">}
What am I missing?
Ooops, stupid mistake...I was embedding this BeginForm within another....The reason this does not work is you cannot have one form nested within another.