Difference between @html.TextBox and @html.TextBoxFor

Difference between @html.TextBox and @html.TextBoxFor.

My answer on Quora:

In abstract terms, the difference between the html helpers @html.TextBox() and @html.TextBoxFor() are the former is weakly typed and is independent of model and the latter is strongly typed and it should be bound to one of the model property in strongly typed view.

Consider the below piece of code,

This will be rendered as shown in the below image.

When you use, TextBoxFor, while the HTML is generated, it will automatically map the value from the model property to it, in the above case “UserName” . So when you post the values of the current page, if your controller is having your model as the parameter, the value can be retrived directly by accessing the property.

When you look at the above screenshot, the model will not hold the weekly typed “simpleTextBox”.

Hope you find it useful.

Can any one explain me the difference between @html.TextBox() and @html.TextBoxFor() in ASP.net MVC?

Advertisements

Model Binding and Strongly Typed Views

Model Binding and Strongly Typed Views

Answer by Sharmilli Priyadarsini:

In order to demonstrate model binding, I am making use of the default scaffold for Account registration available when you create a new web application with Visual studio.

Let us see how to create a strongly typed view using the below model,

Now, from your solution explorer, expand the controller folder and open the AccountController.

You will find something like the below action method,

Right clicking near the ActionResult and selecting go to view will navigate you to the Register.cshtml view which is strongly typed with “RegisterViewModel”. In order to make a view strongly typed, you can either do it through api or marking the model on the top of page as shown below:

Doing, so will generate you a strongly typed view as Register.cshtml bound to RegisterViewModel inside the accounts folder in views.

This is how you can create a strongly typed view. Now let us get into the detail of how to design your view by making use of the above model.When you take a close look of the above screenshot, you will see set of html helpers i.e all that follows “@html.” are said to be html helpers. Why because, they will generate the equivalent html to generate your web pages.

Let us take the below example
@html.LabelFor(m=>m.UserName, new{@class=”my-label”})
@ in the above line of code is known as razor syntax. Everything that follows the razor syntax will be rendered at the web server and are C# code in the .cshtml page and vb code in .vbhtml respectively.
html. represents that a html helper so the equivalent output will be a html code generated by the web server. we have different types of helpers like html helper, ajax helper etc.

LabelFor will generate a html label with the name user name which is strongly typed. But usually the label’s will not post the values to controllers they are just plain text. But if we have other controls like textbox, checkbox we can retrive their values in the controller.

Hope this clears your doubt.

I am getting quite confusion in binding the model data in view page, can any one explain me? How exactly it is done?

How to do I display a grid or a table in the drop down list for multiple columns with a header in asp.net with MVC4?

Answer by A Quora admin:

Check this fiddle, Table in dropdownlist written in kendo UI. If you are looking for something like this, you can write a custom html helper and make use of it. Make sure you use table tr td tags added to each to select and option tag. A sample of it for your purview.
ASP.NET MVC Custom dropdown from model with custom HtmlHelper

How to do I display a grid or a table in the drop down list for multiple columns with a header in asp.net with MVC4?

What should I choose, Angular.js or .NET MVC?

Angularjs vs ASP.NET MVC

Answer by A Quora admin:

Angularjs is a javascript framework written in MVVM pattern, But works almost in a similar fashion to MVC. .NET MVC is a server side technology written on the top of .NET framework  that converts your HTML helpers into the html tags, apply roles and styling and works alongside with the JQuery as a fully functional web pages. Where as angularjs is a javascript framework that does the similar action on the client side.

Precisely the answer is, You can very well use angularjs along with MVC. However, whenever you are dealing with complex views or when your model is bound to multiple DOM objects, I will recommend you to choose MVVM over MVC.

What should I choose, Angular.js or .NET MVC? Which language has better career prospects?

ASP.NET MVC vs ASP.NET?

Both ASP.NET webforms and MVC  are microsoft technologies available for building dynamic web pages.  The following are the reasons why one should you prefer one technology over the other.

Why MVC ?
1) Lightweight and fast : The  ASP.NET follows the event driven approach that strongly binds your UI with the server side event handelling. Whereas in case of MVC, the UI and the server side logic are decoupled and makes them independent entities. Also, MVC got rid of one of the state management techniques called viewstate that makes the asp.net pages fat and takes time to load the controls.
2) Highly customisable due to rich support of HTML, CSS, Javascript, AJAX and JQuery : If you look at your design files of MVC, they are plain HTML controls along with server side HTML helpers that will again present the web pages with clean DOM unlike  ASP.NET webforms that generate complex html tags and attribute values while presenting the webpages to the user.
3) Highly modular with clean url support: Clean URL is something very native to MVC pattern, because the route engine process the URLs directly in case of mvc (default format is domain_name/controller_name/action_name/additional_parameters) whereas in webforms the request will try to look for the equivalent aspx page and the url will look too long and unorganized in most of the cases.
4) SEO: As I told you before the mvc webpages will present a very straight forward HTML webpage with clean url that make sense not only to the users but also for the search engines to index your websites. So obviously your websites will be prefered by google or other search engines whenever some one looks for information relevant to your business, that will result in more hits and more business.

Why ASP.NET (Webforms)?
1) Legacy : Being a pioneer technology, we have a lot of applications built in ASP.NET already and it is practically difficult to invest a lot of money for rewriting those applications in mvc. So the enhancements to the existing system will preferably be written in the same software stack, instead writing them on something new.
2) Availability of skill pool: We have a huge skill pool of  ASP.NET developers as it is there for quiet a long time and MVC is comparitively very young technology. So if your project has minimal time to train the resources, going with a familiar software stack is preferable.
3) Not so many dependent technical skills: If you say that you are good in MVC, you are expected to be equally good in HTML5,javascript,JQuery and CSS along with C#.
4) Continuous support from microsoft: Microsoft is providing dedicated support for ASP.NET and continuously investing in R&D to make it better. One of the few significant steps of it is vNext that is aimed at making it lightweight.

What is the difference between ASP.NET MVC and ASP.NET?

How to generate dynamic repeating controls and providing unique ids using HTML and JQuery?

Hi Folks,

It has been a long time, Hope everyone is doing great.

In this post I am writing about how to generate dynamic repeating controls and providing unique ids using HTML and JQuery. You will come to know how to create a multiple list of controls, that will be created when you click on add button, and then providing unique ids to them. I am assuming you have referenced JQuery libraries in your page already.Let us jump to the steps.

  • Inside the html body tag part, declare a div and give its id as “divDynamic”.

<span id=”btnAddNew”>Add New</span>

<div id=”divDynamic”></div>

  • Create another div that is set to display none and its id is going to be “divTemplateContainer”. This is going to have all the controls that are going to be repeated.

<div style=”display:none” id=”divTemplateContainer”>

<input type=”text” id=”textbox”/>

<input type=”text” id=”textbox1″/>

</div>

  • Now, we need to regenerate the controls on click of “Add New”. So, inside the script tag, write a Jquery click event for the btnAddNew, where fetch the inner html of the template and append it to the divDynamic. Once after appending pass the container id and index and replace the ids as given in the “GetElementInsideContainer” method.

<script>

var Index = 0;

$(“#btnAddNew”).click(function () {

var template= $(“#divTemplateContainer”)[0].innerHTML;
var domText = ‘<div id=”template’ + Index + ‘”></div>’;
if (template!= “”) {
$(“#divDynamic”).append(domText);
$(“#template” + Index ).append(template);
GetElementInsideContainer(“template” + Index , Index ); /*Call the action by passig the div id and the index*/
Index ++;
}

});

/*Change the ids within the template on the fly*/
function GetElementInsideContainer(containerID, index) {
var elm = {};
var elms = document.getElementById(containerID).getElementsByTagName(“*”);
for (var i = 0; i < elms.length; i++) {
if (elms[i].id) {
$(“#” + elms[i].id).attr(“id”, elms[i].id + index);
}
}
}

</script>

Hope the above steps saves your time. Happy coding!

MVC Plurasight Video tutorials

MVC Plurasight Video tutorials

To get a quick and strong foundation in the ASP.NET MVC pattern, make use of the free video lectures in the site. Hope it will get you the conceptual knowledge on MVC, you are looking for.

Then, Go ahead and try out the hands on as given in : http://www.asp.net/mvc/tutorials/mvc-music-store

You can find the completed project of the same in : http://mvcmusicstore.codeplex.com/

It is highly recommended to learn JQuery and LINQ to Entity to make a good MVC application.

Happy coding friends!