Questions on UI for ASP.NET MVC Forum

14 answers

138 views

Is there an beta/test UI for ASP.NET MVC for vNext (aka MVC 6)? Our team is starting to develop an .NET MVC 5 application, however, the concern is that by the time the product reaches a mature development stage, it will be immediately depreciated by MVC6.

General Discussions

answered on 07 Sep 2015

1 answer

66 views

Using viewmodelpage in read action

Hello,

I need to use my viewmodelpage in my read action of kendo mvc grid. This my codes :

#Controller

VolViewModel model;

public ActionResult Index()
{
model = new VolViewModel { Item = new List<Vol>() };
model.Item = _volBusiness.GetAllVol();
return View(model);
}

[System.Web.Mvc.AcceptVerbs(HttpVerbs.Post)]
public ActionResult Read([DataSourceRequest]DataSourceRequest request)
{
var result = model.Item;
return Json(result.ToDataSourceResult(request));
}

#Index.cshtml

.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.PageSize(15)
.Model(model =>
{
model.Id(m => m.VolId);
})
.Read(read => read.Action("Read", "Vol")
)

Thanks,

Grid

answered on 07 Sep 2015

1 answer

194 views

CookieLocalizationModule is not working

I have a Telerik MVC extension project that use CookieLocalizationModule to change language used in the application. It works fine and is setup in Web.Config as

        <httpModules>
           <add name="CookieLocalizationModule" type="OTP.Ring.Web.CookieLocalizationModule, OTP.Ring.Web" />
       </httpModules>

But after upgrade to Kendo, it is no longer working. So I want to know how to set CookieLocalizationModule in Kendo. Thanks.

General Discussions

answered on 07 Sep 2015

1 answer

932 views

Bind click event after deferred initialization of Kendo Grid

How can I bind the click event after the deferred script is loaded?

I have a Kendo Grid (in Razor) with deferred initialization due performance issues. So all js scripts are included in the end of the document.

@(Html.Kendo().Grid<MyViewModel>()

.Name("myGrid")

.Columns(columns =>

{

columns.Bound(c => c.Name);

columns.Bound(c => c.City);

columns

.Bound(c => c.Id)

.Title("Commands")

.Sortable(false)

.Filterable(false)

.ClientTemplate(

"<a href='" + @Url.Action("Details", new { id = "#=Id#" }) +

"' class='btn btn-success' title='Details'>" +

"<span class='glyphicon glyphicon-list'></span></a>" +

"<a href='" + @Url.Action("Edit", new { id = "#=Id#" }) +

"' class='btn btn-info' title='Edit'>" +

"<span class='glyphicon glyphicon-pencil'></span></a>" +

"<a href='\\#' data-id='#=Id#' data-action='deactivate' " +

"class='btn btn-warning' title='Desactivate'>" +

"<span class='glyphicon glyphicon-remove-sign'></span></a>"

);

})

.Pageable()

.Sortable()

.Filterable()

.DataSource(ds => ds

.Ajax()

.Read(read => read.Action("ReadData", "MyController")).Sort(a => a.Add("Name")))

.Deferred()

)

Then I have a section at the end where I want to bind a click event to the <a> click of every element which a data-action='deactivate' attribute. The problem is the deffered initialization is performed after my document is ready.

@section scripts {

@Scripts.Render("~/bundles/kendo")

@Html.Kendo().DeferredScripts()

<script>

$(document).ready(function () {

$('[data-action="deactivate"]').click(function (event) {

var id = $(event.target).attr('data-id');

alert(id);

});

</script>

}

Grid

answered on 04 Sep 2015

2 answers

161 views

copy rows after rows selected via checkbox

Hello,

i have a grid with the column template with checkboxes, and chekbox to select all rows;

in the grid i have enabled copy (.AllowCopy (true)), and it works if I select by clicking the rows and not the checkbox, however, if for example I select all lines using checkbox, the copy is not working.

I assumed might be a problem of focus, click on the checkboxes instead of rows, you lose the data to be copied, I have tried in the javascript selection function to shift the focus on the tbody of the grid, but this does not work ...

Any suggestions?

Thanks, Roberto

Grid

answered on 04 Sep 2015

6 answers

1.1K+ views

Datasource read not being called on initial page load

I have a grid in a partial view and it's data source fails to call the read method on the initial page load. It does get called when I submit the ajax form, but the problem is that I want some default data to appear in the grid when the page initially loads.

Also, if I take out the model as a parameter on the read method, then the read method will in fact get called during the initial page load, but the problem with that is then I won't be able to feed it any parameters to filter the data from the ajax form.

I tried to call the read method from javascript in document.ready() to try and force it to call the read method, but that didn't work. Is there a way I can make the read method get called in the initial page load while also feeding it the model as a parameter?

Here is the partial view called _ProjectResults

@model MvcTestProject.Models.ProjectSearchModel

@(Html.Kendo().Grid<MvcTestProject.Models.ProjectItem>()

.Name("projectresultsgrid")

.Columns(columns =>

{

columns.Bound(p => p.KeyID).Title("Key ID").Width(130);

columns.Bound(p => p.StoreNumber).Title("Store").Width(130);

columns.Bound(p => p.ProjectType).Title("Type").Width(150);

columns.Bound(p => p.ProjectStatus).Title("Status").Width(130);

columns.Bound(p => p.InstallStartDate).Title("Start Date").Width(130).Format("{0:MM/dd/yyyy}");

})

.Pageable()

.Sortable()

.Scrollable(scr => scr.Height(550))

.Filterable()

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(50)

.ServerOperation(false)

.Read(data => data.Action("ReadProjects", "Project", Model))

)

Here is the parent page

@model MvcTestProject.Models.ProjectSearchModel

@{

Layout = "~/Views/Shared/_Layout_Project.cshtml";

ViewBag.Title = "Index";

}

<h2>Project Search</h2>

<div>

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "dvProjectResults" }))

{

<fieldset style="margin:10px;">

<legend style="margin:5px;font-weight:bold">

Search Criteria

</legend>

<table>

<tr>

<td>@Html.LabelFor(m => Model.ProjectTypeID)</td>

<td width="400px;">

@(Html.Kendo().DropDownListFor(m => m.ProjectTypeID)

.HtmlAttributes(new { style = "width: 250px" })

.DataTextField("TypeName")

.DataValueField("ProjTypeID")

.BindTo(Model.ProjectTypeOptions)

.OptionLabel(" ")

)

</td>

</tr>

<tr>

<td>@Html.LabelFor(m => Model.ProjectStatusID)</td>

<td>

@(Html.Kendo().DropDownListFor(m => m.ProjectStatusID)

.HtmlAttributes(new { style = "width: 250px" })

.DataTextField("StatusName")

.DataValueField("ProjStatusID")

.BindTo(Model.ProjectStatusOptions)

.OptionLabel(" ")

)

</td>

<td>@Html.LabelFor(m => Model.StartDate)</td>

<td>@Html.EditorFor(m => Model.StartDate)</td>

</tr>

<tr>

<td>@Html.LabelFor(m => Model.KeyID)</td>

<td>@Html.EditorFor(m => Model.KeyID)</td>

<td>@Html.LabelFor(m => Model.EndDate)</td>

<td>@Html.EditorFor(m => Model.EndDate)</td>

</tr>

<tr>

<td>@Html.LabelFor(m => Model.StoreNumber)</td>

<td>@Html.EditorFor(m => Model.StoreNumber)</td>

</tr>

<tr>

<td colspan="2"><input type="submit" value="Search" /></td>

</tr>

</table>

</fieldset>

}

<div id="dvProjectResults" style="margin:10px;">

@{Html.RenderPartial("_ProjectResults", Model);}

</div>

<script type="text/javascript">

$(document).ready(function () { JSReadProjects(); });

function JSReadProjects() {

var grid = $("#projectresultsgrid").data("kendoGrid");

grid.dataSource.read();

}

</script>

Here is the http post actionresult that is executed when the ajax form is submitted:

[HttpPost]

public ActionResult ProjectSearch(ProjectSearchModel model)

{

return PartialView("_ProjectResults", model);

}

Here is the read method on the controller:

public ActionResult ReadProjects([DataSourceRequest] DataSourceRequest request, ProjectSearchModel searchModel)

{

var data = datamgr.GetProjects

(

searchModel.KeyID,

searchModel.StoreNumber,

searchModel.ProjectTypeID,

searchModel.ProjectStatusID,

searchModel.StartDate,

);

var serializer = new JavaScriptSerializer();

var result = new ContentResult();

serializer.MaxJsonLength = Int32.MaxValue; // Whatever max length you want here

result.Content = serializer.Serialize(data.ToDataSourceResult(request));

result.ContentType = "application/json";

return result;

}

Grid

answered on 04 Sep 2015

1 answer

115 views

debug kendo error

Hi,

I am getting an error on page typeerror : e is undefined on firebug. Is there a way that i can debug that and see on which method am getting that exactly? If no can you please suggest me where i can look. I just have grid on that page.

I am attaching the screenshot of my firebug error.

Thanks,

Veena

Grid

answered on 04 Sep 2015

4 answers

317 views

Client Template in grid column

Hi Everybody,

I have a problem using the grid in asp.net mvc and Telerik for asp.net mvc.

The Client template works fine when entering information and fine display a DateTimePicker.

But when I leave the field is become empty instead of the Value choosed in the DateTimePicker.
Do you have any suggestions?

<P>@(Html.Kendo().Grid<Object.Clubs>().BindTo(Model.Clubs).Name("Clubs")<BR>.ToolBar(configurator

=><BR> {<BR>

configurator<BR><BR>.Create();<BR> })<BR><BR>.Editable(e

=>

e.Mode(GridEditMode.InCell).CreateAt(GridInsertRowPosition.Bottom))<BR>.Events(e

=> e.Edit("onEditItem")).Events(e =>

e.Save("onSaveItem"))<BR>.Columns(columns =><BR> {<BR>

columns<BR><BR>.Bound(m =>

m.ClubName).EditorTemplateName("RelatedClubs").ClientTemplate("#= ClubName#"

+<BR>"<input type='hidden' name='Clubs[#= indexClub(data)#].ClubName'

value='#= ClubName#' />"<BR> );<BR>

columns</P>

<P><BR>.Bound(m => m.EndDate).Width(150).Encoded(true).ClientTemplate("#

if(EndDate != null){ kendo.toString(kendo.parseDate(EndDate,'dd/MM/yyyy'), '" +

"dd-MM-yyyy" + "') } else { kendo.toString('') } #" +<BR>"<input

type='hidden' name='Clubs[#= indexClub(data) #].EndDate' value='#=

ConvertDate(EndDate) #' />").Format("{0: dd-MM-yyyy}");<BR>

columns<BR><BR>.Command(m => m.Destroy()).Width(100);<BR>

})<BR><BR>.DataSource(dataSource => dataSource.Ajax()<BR>.Read(r

=> r.Action("ClubsRead", "Model"))<BR>.Model(model =><BR>

{<BR> model<BR><BR>.Id(p => p.Id);<BR>

})<BR> )<BR><BR>)</P>

Best Regards

Lars

Grid

answered on 03 Sep 2015

3 answers

99 views

css issues with 2015.2.827 build

Hi guys, seems like there is an issue with all the .mobile based css files with an element missing like the below:

taken from kendo.mobile.all.min.css

.km-actionsheet>li>a{background-image:-webkit-gradient(linear,)

looking at a previous version it seems it is missing this:

50% 0,50% 100%,color-stop(0,rgba(255,255,255,0.5)),color-stop(0.06,rgba(255,255,255,0.45)),color-stop(0.5,rgba(255,255,255,0.2)),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(1,rgba(100,100,100,0)));

This is just one example that JustCode is highlighting as a css error it has picked up 149 errors in total related to issues like this (assuming they are all like this)

If you need more examples then let me know and I will provide them.

General Discussions

answered on 03 Sep 2015

2 answers

306 views

Compile Kendo.Mvc against MVC 5.2.3 ?

Hi,

I have massive problems with a messed-up MVC project using Kendo UI MVC wrappers (Kendo.Mvc.dll at Version 2015.1.429.545).

To get the project running again I made several nuget updates and so far it compiles and spins up again. But on every view where any @Html.Kendo() widget is used I get an EntryPointNotFoundException in System.Web.Mvc.

sample trace:

bei System.Web.Mvc.IViewDataContainer.get_ViewData()<br>   bei System.Web.Mvc.HtmlHelper.get_ViewData()<br>   bei Kendo.Mvc.UI.Fluent.WidgetFactory.get_ViewData()<br>   bei Kendo.Mvc.UI.Fluent.WidgetFactory.AutoComplete()<br>   bei ASP._Page_Views_Suche_Index_cshtml.Execute()

in

c:\# Sources\baumkataster\sources\trunk\Baumkataster.Web\Views\Suche\Index.cshtml:Zeile 67.<br>   bei System.Web.WebPages.WebPageBase.ExecutePageHierarchy()<br>   bei System.Web.Mvc.WebViewPage.ExecutePageHierarchy()<br>   bei System.Web.WebPages.StartPage.RunPage()<br>   bei System.Web.WebPages.StartPage.ExecutePageHierarchy()<br>   bei System.Web.WebPages.WebPageBase.ExecutePageHierarchy(WebPageContext pageContext, TextWriter writer, WebPageRenderingBase startPage)<br>   bei System.Web.Mvc.RazorView.RenderView(ViewContext viewContext, TextWriter writer, Object instance)<br>   bei System.Web.Mvc.BuildManagerCompiledView.Render(ViewContext viewContext, TextWriter writer)<br>   bei System.Web.Mvc.ViewResultBase.ExecuteResult(ControllerContext context)<br>   bei System.Web.Mvc.ControllerActionInvoker.InvokeActionResult(ControllerContext controllerContext, ActionResult actionResult)<br>   bei System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilterRecursive(IList`1 filters, Int32 filterIndex, ResultExecutingContext preContext, ControllerContext controllerContext, ActionResult actionResult)<br>   bei System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilterRecursive(IList`1 filters, Int32 filterIndex, ResultExecutingContext preContext, ControllerContext controllerContext, ActionResult actionResult)

I checked all the references and binding redirects. So I thought it must have to do with incompatibility between MVC version and Kendo.

My next idea was to try to get the sources of Kendo.Mvc and compile it against the same library versions used in the project. That is at least what I tried to accomplish today. When opening the Project there are two js files missing (kendo.aspnetmvc.js and kendo.dropdownlist.aspnetmvc.js) and after changing reference after reference I end up having 500+ errors on the project.

Has anybody successfully done so and can provide me some help? What are the required steps (change to Framework 4.5, where to get the missing *.js files, which changes to make,...).

Hope somebody can help me out here.

Regards,

Thomas

General Discussions

answered on 03 Sep 2015