This question is locked. New answers and comments are not allowed.
I used the demo code as a base for some AJAX Combo boxes (ie they only load the possible selections on click of the drop down)
Demo is :http://demos.telerik.com/aspnet-mvc/combobox/ajaxloading (specifically the top left style of control)
I have a problem in that nothing ever catches the "click" event on the drop down anchor.
It seems like client side events are not being handled?
Below is the site master.
The following is the drop down as it appears on the user control:
And finally the controller methods...though i set breakpoints on them and they NEVER get fired:
Any help would be great.
Am i using the script registrar correctly?
regards,
James
Demo is :http://demos.telerik.com/aspnet-mvc/combobox/ajaxloading (specifically the top left style of control)
I have a problem in that nothing ever catches the "click" event on the drop down anchor.
It seems like client side events are not being handled?
Below is the site master.
<%@ Master Language="VB" Inherits="System.Web.Mvc.ViewMasterPage" %><%@ Import Namespace="vantageTEM.MVC" %><%-- The following line works around an ASP.NET compiler warning --%><%: ""%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title> <asp:ContentPlaceHolder ID="TitleContent" runat="server" /> </title> <% With Html.Telerik().StyleSheetRegistrar() .DefaultGroup(Function(group) With group .Add("telerik.common.css") .Add("telerik.telerik.min.css") .Add("telerik.default" + ".css") .Add("telerik.rtl.css") End With End Function) .Render() End With%> <link href="../../Content/reset.css" rel="stylesheet" type="text/css" /> <link href="../../Content/layout.css" rel="stylesheet" type="text/css" /> <link href="../../Content/buttons.css" rel="stylesheet" type="text/css" /> <link href="../../Content/lists.css" rel="stylesheet" type="text/css" /> <link href="../../Content/forms.css" rel="stylesheet" type="text/css" /> <link href="../../Content/tables.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js"></script> <script src="<%= Url.Content("~/Scripts/MicrosoftAjax.debug.js") %>" type="text/javascript"></script> <script src="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js") %>" type="text/javascript"></script> <script src="../../Scripts/TabControlManager.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { $("ul.searchfilters").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled - Adds empty span tag after ul.SearchFilters $("ul.searchmenu li span").click(function () { //When trigger is clicked... //Following events are applied to the SearchFilters itself (moving SearchFilters up and down) $(this).parent().find("ul.searchfilters").slideDown('fast').show(); //Drop down the SearchFilters on click $(this).parent().hover(function () { }, function () { $(this).parent().find("ul.searchfilters").slideUp('slow'); //When the mouse hovers out of the SearchFilters, move it back up }); //Following events are applied to the trigger (Hover events for the trigger) }).hover(function () { $(this).addClass("subhover"); //On hover over, add class "subhover" }, function () { //On Hover Out $(this).removeClass("subhover"); //On hover out, remove class "subhover" }); }); </script> <script type="text/javascript"> $(document).ready(function () { $('tr').click(function () { var href = $(this).find("a").attr("href"); if (href) { window.location = href; } }); }); </script> <asp:ContentPlaceHolder ID="HeaderContent" runat="server" /></head><body id="<%= TypeName(Me.ViewContext.Controller)%>"> <%--ALL THE CONTENT OF MY PAGE GOES HERE.Call render partial to draw some controls on this page.These partial views contain the drop downs--%> <% With Html.Telerik().ScriptRegistrar() .jQuery(True).DefaultGroup(Function(group) group.Add("telerik.common.js") group.Add("telerik.grid.js") group.Add("telerik.grid.filtering.js") group.Add("telerik.calendar.js") group.Add("telerik.combobox.js") group.Add("telerik.list.js") group.Add("telerik.datepicker.js") End Function) .Render() End With %></body></html>The following is the drop down as it appears on the user control:
<%@ Control Language="VB" Inherits="System.Web.Mvc.ViewUserControl(Of vantageTEM.MVC.CarrierAccountsViewModel)" %><%@ Import Namespace="vantageTEM.Business" %><% Dim currentCarrierAccountsRow As CarrierAccountsDataSet.VIT_ACC_Carrier_AccountRow = Model.CarriersAccountInformation.VIT_ACC_Carrier_Account.First %><fieldset> <legend>Carrier Information</legend> <ul> <li> <label>Carrier Information</label> <% with Html.Telerik().ComboBox() .Name("CarrierAccounts") .AutoFill(True) .DataBinding(Function(binding) binding.Ajax().Select("_fillDropDownCarriers", "CarrierAccounts").Enabled(True)) .Filterable(Function(filtering) filtering.FilterMode(AutoCompleteFilterMode.StartsWith) End Function) .HighlightFirstMatch(True) .Render() End With %> </li> </ul></fieldset>And finally the controller methods...though i set breakpoints on them and they NEVER get fired:
Public Function _fillDropDownCarriers() Return View() End Function Public Function _fillDropDownCarriers(ByVal text As String) As ActionResult Dim model As EnumerableRowCollection(Of CarrierAccountsDataSet.VIT_CAR_CarrierRow) Using dp As DataProxy = New DataProxy() If (String.IsNullOrWhiteSpace(text)) Then model = dp.getCarriers().Where(Function(rowmatch) rowmatch.CAR_NAME.StartsWith(text)) Else model = dp.getCarriers().AsEnumerable() End If Return New JsonResult With { _ .Data = New SelectList(model.ToList(), "CAR_ID", "CAR_NAME") _ } End UsingAny help would be great.
Am i using the script registrar correctly?
regards,
James