How do i get simple textbox post back in ASP.NET MVC

Question

0.00/5 (No votes)

See more:

Hello all,

I am kind of new to Asp.net MVC and what was very simple to me in asp.net is now causing me headache.

Basically im trying to do a simple store built from the ground up and have taken the route of passing my state variables in the querystring(is this the only way?), I have a master page that contains the menu and a search box the main context page is all the product listings, order and filter options. Every time a user clicks a category from the menu (on the master page) it fills the context then any action the user does on that context such as "next page", "items per page" or "order by" get posted back in the querysttring this means that every time the page loads it has to build the page from the model that has all these state variables.
This all works fine except I'm now stuck on a simple operation of a search box in that its on the master page and i cant access my state variables to pass back what state my page is in and the other issue is i don't even know how to access the search text from the textbox in the controller when a button is clicked next to the searchbox.

Any help on this would be greatly appreciated or ideas of different approaches
Many thanks
Lee

Posted 14-Aug-11 0:27am

troublesum

Add a Solution

Comments

Saad Bin Tahir 15-Aug-11 6:36am

Unable to understand the problem. anything you tried any code ?

troublesum 15-Aug-11 8:09am

Well the problem is how do i access my model data(state variables) on the master page if a button i clicked? i can access all the model data on the context page but not in the master page where the button and search box lives...

2 solutions

Solution 1

You have to forget what you know about post backs, page state and controls in MVC. MVC is elegant, lightweight and simple to work with, but not if you're still thinking about how you do it in web forms.

Button click events aren't posted back for free. You have to either put the button in a form with an action or set up a client-side handler to take the value and post it. There are MVC ways to do this.

For the form approach, go this way: Rendering forms in MVC[^]

For the client-side script, use jQuery: jQuery.post()[^]

I have a ton of articles on my blog related to jQuery, model binding, controllers, actions, etc.: http://jameschambers.com/articles[^]

A couple of tips:
1) you're going to be creating an action on the controller to accept the search criteria. you'll likely want to add an attribute to that action (HttpPost).
2) if you have multiple values that you want passed it, the MVC way to do this would be to create a SearchOptions class that is accepted on the action. Model binding kicks in and takes care of creating the object for you.
3) don't try to wire things into your master page/page load kinds of events (there are some cases where this makes sense, but not in yours). your models should contain functionality, the views represent the model and the controller bind it together.

Feel free to post additional questions more specific to what you're working on.

Cheers.

Posted 15-Aug-11 7:04am

TheyCallMeMrJames

Comments

troublesum 15-Aug-11 15:27pm

Hello TheyCallMeMrJames,

thanks for the reply, I have a solution that is almost complete im just having trouble with the search box that is on the master page.... this search box will be on every page so i will have to have it on the master page or? I Know the differences in ASP and MVC i am using Actions that except lots of variables that are my page state management, I will try and break this down more so you can understand what i am doing
Master Page
• This contains the menu/category selection to the use along with a search box and Search button
Context Page
• lists of all the items from the selected menu/category item
• allows the user to select items per page, paging and order by
Home Page
• Welcome message / special offers
now when the user selects a category from the home page the context is loaded from the Action ShowListing which sends a model object to the view containing all the state variable and items ( items per page / current Page / Total items / order by and the items to display) the page is then built with this model object for example this code calls a helper method that builds the Items per page selection:

<div id="ItemsPerPageContainer">
<%=SalePeg.Helpers.DisplayTools.CreateItemsPerPageSelection(((SalePeg.DAL.Entities.ProductListPackage)ViewData.Model).ItemsPerPage,
((SalePeg.DAL.Entities.ProductListPackage)ViewData.Model).CategoryId,((SalePeg.DAL.Entities.ProductListPackage)ViewData.Model).OrderBy)%>
</div>

And the helper method
public static string CreateItemsPerPageSelection(int currentItemsPerPage, int CategoryId, int OrderById)
{
StringBuilder ItemsPerPageSelector = new StringBuilder();
StringBuilder SelectionLink = new StringBuilder();

int pagecount = 20;
string classname = "";
for (int i = 0; i < 3; i++)
{
SelectionLink.Clear();
if (pagecount != currentItemsPerPage)
{
SelectionLink.Append("<div önclick=\"ItemsPerPageChanged(");
SelectionLink.Append(CategoryId);
SelectionLink.Append(",");
SelectionLink.Append(OrderById);
SelectionLink.Append(",");
SelectionLink.Append(pagecount);
SelectionLink.Append(")\">");
SelectionLink.Append(pagecount);
SelectionLink.Append("</div>");

classname = "ItemsPerPageSelectable";
}
else
{
SelectionLink.Append(pagecount);
classname = "ItemsPerPageSelected";
}

ItemsPerPageSelector.Append("<div class=\"");
ItemsPerPageSelector.Append(classname);
ItemsPerPageSelector.Append("\">");
ItemsPerPageSelector.Append(SelectionLink);

ItemsPerPageSelector.Append("</div>");

pagecount += 20;
}

return ItemsPerPageSelector.ToString();
}

As you can see i pass all the state variables back to the ItemsPerPageChanged Action. This is all working fine with Jquery ajax functionality but my problem comes with the search box on the master page as i stated i cant access my state variables to pass back to the SearchClicked Action in the master page and im not even that sure how to pass back the search string from the search box to the action.

I hope this helps you understand my problem and i hope you can help me

Kind regards

TheyCallMeMrJames 15-Aug-11 17:35pm

If the state variables are int currentItemsPerPage, int CategoryId, int OrderById then why not store them in hidden inputs and grab them with script? You can pass in json objects to your action, so create some classes (like SearchOptions) and then pass the data into the controller using json notation (also fairly easy with jQuery). As I said earlier, model binding kicks in and your objects are hydrated. I'm not sure I get why you're trying to access the state variables from the master page...this doesn't smell like MVC here. Remember that you have layouts, not master pages, and you don't really want to push functionality up the stack there. If you have a search controller, think of that search box as a little piece of client UI that collects something to submit to your search controller. It's actually a lot simpler than trying to push the model back up the layout engine.

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

TheyCallMeMrJames · Accepted Answer · 2011-08-15T11:41:00

Here's an answer incorporating some of the concepts I've details.

Make sure your search box has an ID.

Put any options you want to express in hidden inputs that are accessible via script.

If these need to be persistent for the duration of the clients visit, consider using the session object (or other state-ful approaches).

Use jQuery to collect the relevant bits, bundle them up into a json object and submit it to the SearchController.

If pieces of your UI can be dynamically generated, consider using partial views and creating classes that can hold the data you need to render them. Pass instances of these classes into the partial to render your UI.

Hope this helps.

Cheers.