ComboBoxFor not displaying combo when Iframe true

2 posts, 1 answers
  1. Russ
    Russ avatar
    6 posts
    Member since:
    Apr 2014

    Posted 20 Jun 2014 Link to this post

    I've spent a couple hours and solved my issue, I think.  If Iframe is true, the Kendo UI Widget is not working as a combobox.  If Iframe is false, it works.  Should I be using Iframe true or false, just not sure why I would care unless a browser does not allow them.  Please explain the difference.

    I have a View using the Window and loading content for a partial view and cannot get the ComboBoxFor to show a combobox, it only shows a text box.
    I'm showing my View and PartialView below.  Any ideas?  I see in debugger the exact same combobox with a different ID, working perfectly but then the Window is loaded into an iFrame and does not work.

    //View
    @helper NewProspectWorkflowProject()
    {
       @(Html.Kendo().Window()
        .Name("window")
        .Width(630)
        .Height(650)
        .Title("Add new project")
        .Content("loading user info...")
        .LoadContentFrom("AddProject", "ProspectWorkflow")

        .Iframe(true)
        .Draggable()
        .Resizable()
    )

    <span id="undo" class="k-button">Click here to open the window.</span>

    <script>
    $(document).ready(function() {
    $("#undo")
    .bind("click", function() {
    $("#window").data("kendoWindow").open();
    });
    });
    </script>

    }

    //PartialView
    @{
    Layout = null;
    }

    @model OperationsSite.Models.ProspectWorkflowProject

    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>


    @using (Html.BeginForm())
    {
        @Html.AntiForgeryToken() 
        @Html.ValidationSummary(true)

        <fieldset>
           <legend>ProspectWorkflowProject2</legend>

           <div class="editor-label">
                   @Html.LabelFor(model => model.projectID)
           </div>
            <div>
                  @(Html.Kendo().ComboBoxFor(model => model.projectID)
                              .Name("client_name_dropdown2")
                              .HtmlAttributes(new { style = "width:250px", id = "client_name_dropdown2" })
                              .SelectedIndex(0)
                              .Suggest(true)
                              .Filter("contains")
                              .AutoBind(false)
                              .DataTextField("DisplayValue")
                              .DataValueField("Value")
                               .DataSource(source =>        
                               {
                                    source.Read(read =>
                                    {
                                         read.Action("GetClientNames", "ComboBox");
                                    })
                                   .ServerFiltering(true);
                                 })
                        )
                @Html.ValidationMessageFor(model => model.projectID)
        </div>

    Thank you,

    Russ
  2. Answer
    Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 24 Jun 2014 Link to this post

    Hello Russ,

    When using an iframe, the kendo scripts should be added again inside the partial view (if you are returning just a partial view without the layout), because the scripts that are registered on the main page (that contains the window) are not available within the iframe and the combobox cannot be initialized.

    http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/troubleshooting

    Kind Regards,
    Petur Subev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top