This project is read-only.

Is ASP.NET MVC supported?

Dec 22, 2009 at 7:03 PM

I can't get this to work with JsonResult objects at all.  Is MVC unsupported?

 

 

Mar 13, 2010 at 4:35 AM

After some initial problems, I got his to work.

HTH

John

Controller:

public ActionResult GetJasonTest()
    
    {
   
    var myOptions = "{\"results\": [";

       myOptions += "   { \"id\": \"1\", \"name\": \"Ant\" }, ";
       myOptions+="   { \"id\": \"2\", \"name\": \"Bear\" },";   
       myOptions+="   { \"id\": \"3\", \"name\": \"Cat\" },";   
       myOptions+="   { \"id\": \"4\", \"name\": \"Dog\" }, ";  
       myOptions+="   { \"id\": \"5\", \"name\": \"Elephant\" },";   
       myOptions+="   { \"id\": \"6\", \"name\": \"Fox\" }, ";  
       myOptions+="   { \"id\": \"7\", \"name\": \"Guinea Pig\" },";   
       myOptions+="   { \"id\": \"8\", \"name\": \"Horse\" }, ";  
       myOptions+="   { \"id\": \"9\", \"name\": \"Iguana\" },";   
       myOptions+="   { \"id\": \"10\", \"name\": \"Jaguar\" } ";
       myOptions += "  ], \"total\": 10 }"; // must have total tag

        return JavaScript(myOptions);
    }

 

Script

Gets called everytime dropdown is entered

$('#ffb7').flexbox('GetJasonTest', {  
        width: 120,  
        paging: false  ,  
        allowInput: false  
    });

 

HTML

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
 
 
    <h2>GridDemo</h2>
       <div id="ffb7"></div>

 

Jan 21, 2011 at 11:57 AM

This issues I am having is if I want the flexbox to be a field such as "SomeModel.SomeField"

 

For example:

$('#<%= Html.GetPropertyPathFor(this.Model, model => model.HealthBoard)%>').flexbox({
            "results": [
                         { "id": "1", "name": "Ant" },
                         { "id": "2", "name": "Bear" },
                         { "id": "3", "name": "Cat" },
                         { "id": "4", "name": "Dog" },
                         { "id": "5", "name": "Elephant" },
                         { "id": "6", "name": "Fox" },
                         { "id": "7", "name": "Guinea Pig" },
                         { "id": "8", "name": "Horse" },
                         { "id": "9", "name": "Iguana" },
                         { "id": "10", "name": "Jaguar" }
                     ], "total": 10
                     }, {
                            hiddenValue: "name",
                             selectFirstMatch: false,
                             matchAny: false,
                             autoCompleteFirstMatch: false,
                             queryDelay: 0
                        });

<div class="formitem_text"> 
                        <%= Html.LabelFor(model => model.HealthBoard, "Health Board FlexBox")%> 
                        <div id="<%= Html.GetPropertyPathFor(this.Model, model => model.HealthBoard)%>" class="flexbox"></div>
                      
                        <%= Html.ValidationMessageFor(model => model.HealthBoard)%>
                    </div>

 

 

 

This would render as:

$('#General.HealthBoard').flexbox({
            "results": [
                         { "id": "1", "name": "Ant" },
                         { "id": "2", "name": "Bear" },
                         { "id": "3", "name": "Cat" },
                         { "id": "4", "name": "Dog" },
                         { "id": "5", "name": "Elephant" },
                         { "id": "6", "name": "Fox" },
                         { "id": "7", "name": "Guinea Pig" },
                         { "id": "8", "name": "Horse" },
                         { "id": "9", "name": "Iguana" },
                         { "id": "10", "name": "Jaguar" }
                     ], "total": 10
                     }, {
                            hiddenValue: "name",
                             selectFirstMatch: false,
                             matchAny: false,
                             autoCompleteFirstMatch: false,
                             queryDelay: 0
                        });

 

<div class="formitem_text"> 
                        <label for="General_HealthBoard">Health Board FlexBox</label> 
                        <div id="General.HealthBoard" class="flexbox"></div>
                      
                        
                    </div>

 

 

 

I think the "." causes problems.

I think i will need to change the flexbox js file so that the ID replaces the "." with an underscore, while the "name" attribute of the input element maintains the "." so it can be bound back to the model

Jun 16, 2011 at 2:00 PM
Edited Jun 16, 2011 at 7:01 PM

I was getting an Invalid Label error every time I tried to call my controller action.

I was able to get this to work in MVC by changing Line 291 from: 

else $.getJSON(o.source, params, callback); 

To:

else $.get(o.source, params, callback); 

This is due to the fact that jquery.validate.js (versions prior to 1.8.0), force .getJSON calls to be jsonp.