I created a MVC-3 application (Once we create it we are given a login screen which is already developed). And it has used HTML components found in the toolbox to create text boxes, labels etc. But i want to use standard components found in the toolbox. How can i replace these HTML components with the standard components.
When the user clicks on the Login button, the username and password gets authenticated in the default sample application provided for us. I don't want to change its functionality but what i want is only to change the form components to the Standard components found in the toolbox.
How can i do this ?
<% using (Html.BeginForm()) { %>
<%: Html.ValidationSummary(true, "Login was unsuccessful. Please correct the errors and try again.") %>
<div>
<fieldset>
<legend>Account Information</legend>
<div class="editor-label">
<%: Html.LabelFor(m => m.UserName) %>
</div>
<div class="editor-field">
<%: Html.TextBoxFor(m => m.UserName) %>
<%: Html.ValidationMessageFor(m => m.UserName) %>
</div>
<div class="editor-label">
<%: Html.LabelFor(m => m.Password) %>
</div>
<div class="editor-field">
<%: Html.PasswordFor(m => m.Password) %>
<%: Html.ValidationMessageFor(m => m.Password) %>
</div>
<div class="editor-label">
<%: Html.CheckBoxFor(m => m.RememberMe) %>
<%: Html.LabelFor(m => m.RememberMe) %>
</div>
<p>
<input type="submit" value="Log On" />
</p>
</fieldset>
</div>
<% } %>
Are you talking about these:
<%: Html.TextBoxFor(m => m.UserName) %>
<%: Html.ValidationMessageFor(m => m.UserName) %>
These are called Html helpers. They are used in asp.net mvc to generate html that will play nice with the mvc model binder. If you want to replace them with plain html, you can always view source, see what the rendered html is and paste it in its place, though I don't personally see the point. Nothing good could come of this.
But this is what the two lines above render:
<input data-val="true" data-val-required="The User name field is required." id="UserName" name="UserName" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="UserName" data-valmsg-replace="true"></span>
Les see if I undesrtand, If when you say standard controls you mean ASP.NET Server Side Controls you can't I mean at least not using MVC and the reason is 'cause is like mixing apples and bananas you have to use either WebForms or MVC, if you choose MVC so you have to place the logic in a controller on an specific action that is going to be called once the form the button is inside of is clicked,but if you dont want to, so use a plain old aspx page add server side controls and put the logic on the click event of the button, but you can't mix MVC and WebForms that makes no sense (I'm saying this in a good way :) ) they're different paradigms.
Related
I want to call my code behind method on click of hyperlink on my ASPX design page.
So that I can Fetch the Identity value and pass it to my stored procedure and redirect user to the landing page.
I am facing syntax issue as what to write where.
In my expected code I tried to add runat server but getting error.
Other things are working fine.
Current Code
<div class="row">
<% foreach (System.Data.DataRow item in dt.Rows)
{
%>
<div class="col-xs-6 col-sm-3 mix livefeeds News">
<div class="work-item">
<div class="image-holder">
<a href="<%=item["Identity"].ToString()%>">
<img src="<%=item["ImagePath"].ToString()%>"/>
<h4>
<span><%=item["Headline"].ToString()%></span>
</h4>
</a>
</div>
</div>
</div>
<%
}
%>
</div>
Expected Code
<div class="row">
<% foreach (System.Data.DataRow item in dt.Rows)
{
%>
<div class="col-xs-6 col-sm-3 mix livefeeds News">
<div class="work-item">
<div class="image-holder">
<a href="<%=item["Identity"].ToString() runat="server" onServerClick="MyFuncion_Click"%>">
<img src="<%=item["ImagePath"].ToString()%>"/>
<h4>
<span><%=item["Headline"].ToString()%></span>
</h4>
</a>
</div>
</div>
</div>
<%
}
%>
</div>
Looks like <% %> and quotes are messed up a bit. Tired to correct it:
<a href='<%=item["Identity"].ToString()%>' runat="server" onServerClick="MyFuncion_Click">
However I have doubts this will actually work the way you expect (do a postback straight away) unless you have some javascript handling client onclick.
I have a MVC2 Project using ADO.NET Entity Data Model that I used to generate my view automatically since it has tons of fields. It gave me code like this.
<% using (Html.BeginForm()) {%>
<%= Html.ValidationSummary(true) %>
<div class="editor-label">
<%= Html.LabelFor(model => model.Position) %>
</div>
<div class="editor-field">
<%= Html.TextBoxFor(model => model.Position) %>
<%= Html.ValidationMessageFor(model => model.Position) %>
</div>
But with a ton more fields.
Here is my Controller code:
MyProjectEntities_Career_Applications dbca = new MyProjectEntities_Career_Applications();
[HttpPost]
public ActionResult Apply(Career_Applications application)
{
if (ModelState.IsValid)
{
//save form
dbca.AddToCareer_Applications(application);
dbca.SaveChanges();
}
else
{
ModelState.AddModelError("", "Application could not be submitted. Please correct the errors below.");
}
//redirect to thank you page
return View("Apply", application);
}
When the ModelState.IsValid fails I see the <%= Html.ValidationSummary(true) %> but none of the Html.ValidationMessageFor's ever show up.
What am I missing?
Turns out the problem was with the CSS. Stupid mistake, ugh!
Thanks for the help regardless.
I think you're missing a Jquery reference or error handling library that you're using.
This also happens often when you include validation script multiple times. (In shared view, and in your view)
I am having a view composed of partial views. Please look at the following image -
I am using JQuery for navigating left side panel. Each right side screen is a partial view. Everything works perfectly. The problem here is with the silverlight screen embed in the following view. Lets check the image -
Each time i click on the code link the silverlight screen is reloaded washing out my contents that i entered in the code editor.
Following is the code -
<div id="scanneredit" class="tabs">
<div class="Navigation">
<div class="header"><%=DataOrModel %> Sections</div>
<ul>
<li>
<div class="inner">
<img alt="Code" src="../../Content/Images/Icon_Code.png" />
Code
<%if (Model.ErrorInSection == 5)
{%>
<div class="ErrorIndicator">
<img alt="General Details" src="../../Content/Images/no.png" />
</div>
<%}
else if (Model.ErrorInSection > 5)
{%>
<div class="ErrorIndicator">
<img alt="General Details" src="../../Content/Images/ok.png" />
</div>
<%} %>
</div>
</li>
</ul>
</div>
<div class="tab">
<%Html.BeginForm("Create", "Scanner", FormMethod.Post, new { id = "createscanner" });%>
.
.
.
<div id="code" class="scanner">
<h3>Code</h3>
<h5>Define core logic of a <%=DataOrModel%>.</h5>
<hr />
<%
Html.RenderPartial("~/Views/Scanner/ScannerCode.ascx", new ViewDataDictionary(Model) );
%>
</div>
.
.
.
</div>
Any help is greatly appreciated.
I've got a view that is strongly typed to an object, for example let's say a car object. The car object has a name and description. I'd like to be able to have a dynamic number images uploaded, maybe using the Jquery upload plugin, with the the car object, as well as some meta data for the image like date taken. So how would one use a strongly typed view and a dynamic number of image uploads?
I've found a few examples online for this but they use the creation of a new form and therefore the images would go to a different action. Is there a way to have the car model plus the uploaded images data go to the same action?
Is this possible?
[HttpPost]
public ActionResult Add(Car car, IEnumerable<HttpPostedFileBase> files)
{
return View();
}
#using (Html.BeginForm()) {
<div>
<fieldset>
<legend>Car information</legend>
<div class="editor-label">
#Html.LabelFor(m => m.Name)
</div>
<div class="editor-field">
#Html.TextBoxFor(m => m.Name)
#Html.ValidationMessageFor(m => m.Name)
</div>
<div class="editor-label">
#Html.LabelFor(m => m.Description)
</div>
<div class="editor-field">
#Html.TextBoxFor(m => m.Description)
#Html.ValidationMessageFor(m => m.Description)
</div>
<label for="file1">Filename:</label>
<input type="file" name="files" id="file1" />
<label for="file2">Filename:</label>
<input type="file" name="files" id="file2" />
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
</div>
}
As you are going for dynamic upload following thing help you in ASP.net MVC 3.
Uploadify
Jquery AJAX Upload.
Now do following thing
Create Separate Action that take care of file upload action via Uploadify.
Also make sure you change file to dynamic name.
Create one hidden filed that take care of file names that created via Ajax.
Now on post of form you have car object and one hidden field for all files for Images and at last you have to map file with card object.
Hope this step help you to create your solution.
I am developing a little MVC app.
The problem: I have a view page which has a form to add events, a form to search for events and a list of events.
It's not a big deal to place the components in single views but I need them in one page. I want a permanent form above the list of events.
The problem is that I don't know what to choice as a model object for the view. If I choice a List of events it's working perfectly with the List but not with the form. If I choice a specific Model Object fitting to the form the list hast problem.
What's the best way to handle such views with forms, lists,... ?
That's my View:
<%# Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master"
Inherits="ViewPage<EventPlaza.Web.Models.EventsListViewModel>" %>
<%# Import Namespace="EventPlaza.Storage.Model" %>
<%# Import Namespace="EventPlaza.Web.HtmlHelpers" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Home Page
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id="EventControlsContainer">
<h3>Add Event Link</h3>
<div>
<% Html.RenderPartial("AddEvent", new AddEventModel()); %>
</div>
<h3>Search for Events</h3>
<div>
<form>
Place:
<input id="elementID" name="elementID" type="text" class="inputSearch" />
Date:
<input id="datepicker" name="elementID2" type="text" class="inputSearch" />
<input id="addEvent" type="submit" value="Find Events" />
</form>
</div>
</div>
<% foreach(var product in Model.Events) { %>
<% Html.RenderPartial("EventSummary", product); %>
<% } %>
<div class="pager">
<%: Html.PageLinks(Model.PagingInfo,
x => Url.Action("List", new {page=x})) %>
</div>
</asp:Content>
This the AddEvent View Control:
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<EventPlaza.Storage.Model.AddEventModel>"%>
<% Html.EnableClientValidation(); %>
<% using (Html.BeginForm("AddEvent", "Event", FormMethod.Post)) { %>
Event Link:
<%: Html.TextBoxFor(x => x.EventLink) %>
Event Name:
<%: Html.TextBoxFor(x => x.EventName) %><br />
Place:
<%: Html.TextBoxFor(x => x.Place) %>
Starting Date:
<%: Html.TextBoxFor(x => x.StartingDate) %> <br />
End Date:
<%: Html.TextBoxFor(x => x.EndDate) %>
<input id="Submit" type="submit" value="Add Event" />
<% } %>
I strongly recommend that you should not be using the Model object from the your Domain Model directly as the type of view instead you should make a custom EventViewModel and keep three different objects corresponding to each partial view you have.