Questions on UI for ASP.NET MVC Forum

5 answers

196 views

Dear Telerik Community,

I've recognized some weird behavior of the DatePickerWidget when switching from one month to another. You can take a look at the screen shot to see exactly what I'm talking about. I don't know if this already came up to somebody of you - I hope it did so someone can help me fix it.

Kind regards,

Thomas

DatePicker

answered on 07 Sep 2015

14 answers

160 views

Inquiry: Beta/Test Packages for vNext?

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

87 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

215 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

960 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

194 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

[Solved] 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

147 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

349 views

[Solved] 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

125 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