Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • alexant 22 posts 42 karma points
    Sep 24, 2013 @ 21:36
    alexant
    0

    Getting values from <input> tags

    Dear Sirs,

    probably my question has nothing to do with Umbraco directly, but anyway..

    I ve got the following inputs:

    <label>Land</label>
                  <select id="combobox">
                    <option value="">Select one...</option>
                    <option value="Thüringen">Thüringen</option>
                    <option value="Hessen">Hessen</option>
                  </select>

    <label for="tags">Tag a City</label>
                    <input id="tags" size="50" />

    <label for="from">Begin</label>
                <input type="text" id="from" name="from" style="width:70px" />

    <label for="to">End</label>
                <input type="text" id="to" name="to" style="width:70px" />

    <label for="amount">Price range:</label>
                <input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
                <div id="slider-range"></div>

    <input type="checkbox" id="check" /><label for="check">Intensiv</label>

    <input type="submit" value="KLICK" class="submit"/>

    Question:

    How do I get my variables take the values selected in those <input> tags?

    Smth like

    var sLand = value from the <select id="combobox">

     

    The aim is that I can later filter my nodes depending on the values of these variables.

    Thanks!

  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    Sep 24, 2013 @ 23:16
    Jeavon Leopold
    0

    Hi, assuming you are using Mvc I would recommended you take a look at the documentation about how to use forms here

    I would also recommend that you watch the Surface Controller chapter on Umbraco.tv (€19 per month)

    Jeavon

  • Alex Skrypnyk 6133 posts 23952 karma points MVP 7x admin c-trib
    Sep 24, 2013 @ 23:17
    Alex Skrypnyk
    0

    Hi,

    Do you have jquery on page ?

    var yourValue = $('#combobox').val();
    

    Alex

  • Funka! 398 posts 661 karma points
    Sep 25, 2013 @ 22:50
    Funka!
    0

    Before the days of MVC controllers and model-binding, you can use old-school approach of directly accessing Request.Form. (Note, be sure to add a name attribute to your select boxes and inputs, not just an ID!)

    @{
     var sLand = Request.Form["combobox"];
    }
    

    Be sure to check against empty-strings and nulls, etc., and never forget proper sanitation/validation before using this value. If you are using MVC approach, you would want to look into how to do "model-binding" in your controller. (But still be sure to add the name attribute to all of your form elements!)

    Best of luck to you!

  • alexant 22 posts 42 karma points
    Sep 26, 2013 @ 20:30
    alexant
    0

    I tried to go further and steped through the video serie Surface Controller (thanks Leopold).

    So it works but I need some more on the knowledge.

    The idea is:

    On the left side of my page are some inputs of parameters  and the "search" button.

    On the right side there is the list of children nodes of current page, filtered through those parameters.

    So each time I press "search" button - the list schould be renewed.

    <div id="mainContent" class="fc">
        <div class="navigation" style="width:200px; height:90%; float:left;">   

                   @Html.Partial("KursSearch", new Koiak.StandardWebsite.ContactFormModel()) &nbsp;    </div>
        <div style="height:500px; float:left;">
                    @Umbraco.RenderMacro("SKList")    &nbsp;    </div>
        <div style ="height:90%">

    </div>

     

    The "KursSearch" PartialView calls the following action:

    @Html.Action("Filter", "SchoolListSurface")

    The SchoolListSurfaceController has the following actions:

        public class SchoolListSurfaceController : SurfaceController
        {
            public ActionResult Index()
            {
                return View();
            }
            public ActionResult Filter()
            {
                return PartialView("SchoolFilterView", new SchoolList());
            }
            [HttpPost]
            public ActionResult Search(SchoolList model)
            {
                string theLand = model.Land;
                string theCity = model.City;
                DateTime theBegin = model.Begin;
                DateTime theEnd = model.End;
                int theMaxPreis = model.MaxPrice;
               

                return PartialView("SchoolListView", model);
            }
        }

     

    In the "SchoolFilterView" PartialView I collect the filter model:

    @model sprach.Models.SchoolList

    @using (Html.BeginUmbracoForm<sprach.Controllers.SchoolListSurfaceController>("Search")) {
        @Html.AntiForgeryToken()
        @Html.ValidationSummary(true)

        <fieldset>     <legend>SchoolList</legend>

                             <div class="editor-label">        @Html.LabelFor(model => model.Land)    </div>
                             <div class="editor-field">         @Html.EditorFor(model => model.Land, new { @class="span3", placeholder ="Land", name="Land" })
                                                                             @Html.ValidationMessageFor(model => model.Land)
                             </div>

          ......

          <input type="submit" value="Filter" />

    </fieldset>

     

    The "SchoolListView" PartialView should actually show the filtered list , smth Like.

    The skList Macro shows following

    @using umbraco.BusinessLogic;
    @using umbraco.MacroEngines;
    @inherits umbraco.MacroEngines.DynamicNode
    @inherits umbraco.MacroEngines.DynamicNodeContext

    @{ var schules = Model.Descendants("School").Where("  !!! I don't know how to write it correctly: .Land == filter model .Land && .Preis < filtermodel.MaxPreis    - anyway I have more parameters to filter through").OrderBy("sName"); }

    <ul> @foreach (var school in @schules)   {
            <li><a> @school.sName  </a>    </li>   }
    </ul>

     

    Question:

    How to bind there the filter model Data:

    @{ var schules = Model.Descendants("School").Where("  ...... ?

    And how to get the skList macro (or I can make it partialview) to be reloaded/renewed when I press "Find"

     

    Thanks

Please Sign in or register to post replies

Write your reply to:

Draft