Questions on UI for ASP.NET MVC Forum

8 answers

1.0K+ views

Possible bug with window using Visible(false)

Hi,

We're starting to play with the MVC beta and liking what we're seeing so far. But I think I may have found a bug with the window control. If you default the visible state to false the window as well as the content get styled to display:none. It seems like the display: none never gets removed from the content section when the window is activated. All I see in the UI is the title bar of the window. I ran into this in my application and was able to reproduce it on one of the demo pages. In the actions.cshtml page I added .Visible(false) like so:

@(Html.Kendo().Window()

.Name("window")

.Title("About Josef Hoffmann")

.Actions(actions => actions

.Custom("custom")

.Minimize()

.Maximize()

.Close()

)

.Content(@<text>

<div class="armchair">

<img src="@Url.Content("~/Content/web/window/kubus-armchair.png")"

alt="Josef Hoffmann - Kubus Armchair" />

Josef Hoffmann - Kubus Armchair

</div>

<p>

Josef Hoffmann studied architecture at the Academy of Fine Arts in Vienna,

Austria, under Art Nouveau architect Otto Wagner, whose theories of functional,

modern architecture profoundly influenced his works, and in 1896 he joined his office.

</p>

<p>

In 1898, he established his own practice in Vienna. In 1897, inspired by Mackintosh

and the Glasgow School, he was one of the founding members with Gustav Klimt, of an

association of revolutionary artists and architects, the Vienna Secession.

</p>

<p>

In 1903, he founded with architects Koloman Moser and Joseph Maria Olbrich, the Wiener

Werkstätte for decorative arts.

</p>

<p>

They aspired to the renaissance of the arts and crafts and to bring more abstract and

purer forms to the designs of buildings and furniture, glass and metalwork, following

the concept of total work of art. Hoffman's works combined functionality and simplicity

of craft production with refined and innovative ornamental details and geometric

elements. He is an important precursor of the Modern Movement and Art Deco.

</p>

<p>

Source:

<a href="http://www.senses-artnouveau.com/biography.php?artist=hof" title="About Josef Hoffmann">http://www.senses-artnouveau.com/<;/a>

</p>

</text>)

.Draggable()

.Resizable()

.Visible(false)

.Width(500)

)

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

<script>

$(document).ready(function() {

var dialog = $("#window");

$("#undo").bind("click", function() {

dialog.data("kendoWindow").open();

});

dialog.data("kendoWindow").wrapper.find(".k-custom").click(function(e){

alert("Custom action button clicked");

e.preventDefault();

});

</script>

<style scoped>

#example {

min-height:500px;

}

.armchair {

float: left;

margin: 20px 30px;

text-align: center;

}

.armchair img {

display: block;

margin-bottom: 10px;

}

</style>

Let me know if there's something I'm doing wrong or if this indeed is an issue with the kendo code. Thanks!

Regards,
Brian Roth

Window

answered on 27 Apr 2015

3 answers

259 views

Regression Analysis - Trend Line

Hi,

I have a series that is based on the following:

x (horizontal) axis: 12 months for current year.

y (vertical) axis: inches of rain that fell in that month (units is inch)

Now, I have my series data and all charts well.

The one thing I also have is the starting point (pt A) and end point (pt B) for a simple linear regression line that I need to draw a straight line from pt A to pt B to show the trend over time. Point A will reside in the first column (January) and point B will reside in the last column (December). ( I am using canvas for the charting).

I would prefer to do this with the 2 end points I already have as opposed to determining each point for each month to create a different chart series based on these points where due to rounding et al - which could result in this new curve not being perfectly perfectly straight.

So I guess in short, is it possible to draw a straight line from month 1 to month 12 on a chart knowing only 2 points where the line would be inserted via svg et al at dynamically?

Thanks,

Rene.

Chart

answered on 27 Apr 2015

3 answers

142 views

Export to PDF Bug

I am not able to export gantt for all views. I have Year and week view set. Year exports fine but when I try to export week i have blank pdf. I also tried to export day on demo on http://demos.telerik.com/kendo-ui/gantt/pdf-export and I am not able to export it.

I this bug or I am missing something?

Attached is PDF caputre of day export from demo page http://demos.telerik.com/kendo-ui/gantt/pdf-export

Thanks

Gantt

answered on 27 Apr 2015

1 answer

96 views

Page scrolls up on closing kendo window

I have a kendo window loading a cshtml page. I scroll down the main page until i reach the section which opens the kendo windo. Once i have done my required operation in the kendo window and close the kendo window, on the first click in the main page, it scrolls up automatically. Any suggestions as to why this may happen.

Window

answered on 27 Apr 2015

1 answer

186 views

Kendo Grid is not showing properly during Visual Studio debugging.

Hi,

I am using the Kendo Grid with the datasource but for some reason the grid doesn't render properly during Visual Studio's Debugging option.

However, when I go and publish it to an IIS server, it will load up everything just fine.

I noticed that during the localhost instance, I am getting an "Uncaught ReferenceError: Kendo is not defined.

Is there somethign I am missing that is causing this as published, the grid works fine, but using the localhost instance through Visual Studio, the grid is showing up with errors?

General Discussions

answered on 24 Apr 2015

1 answer

329 views

Grid In-Line edit with AutoComplete results in [object Object]

I've got a Grid with a cell that has an editor template that contains an auto complete object.

When the edit for this cell is complete, the grid displays the data as "[object Object]".

If the user goes back and uses the auto complete to select a field, the correct string is passed back to the Grid from the Editor template, however the auto complete functionality becomes buggy. (no javascript errors are thrown)

Grid Code:

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

.Name("PendingBatchListingInputGrid")

.Columns(c=>

{

c.Bound(a => a.InputDebtorName).Title("Debtor").EditorTemplateName("InputDebtorName") //Shows valued of [object Object] the first time it is edited, shows correct value if user goes back to edit cell again

})

.DataSource(ds => ds.Ajax()

.Model(m =>

{

m.Id(p =>p.InputId);

})

.Create(create => create.Action("PendingBatchListingInputCreate", "PendingBatchListing"))

.Update(update => update.Action("PendingBatchListingInputUpdate", "PendingBatchListing"))

.Read(r => r.Action("PendingBatchListingInputRead", "PendingBatchListing")

.Data("getData")

.Type(HttpVerbs.Post))

.ServerOperation(false)

)

.Editable(e=>e.Mode(GridEditMode.InCell))

)

Editor Template Code:

@model object

<script>

function onAdditionalDataDebtorSearch() {

$('#InputDebtorName').data("kendoAutoComplete").list.width(500);

return {

debtorName: $("#InputDebtorName").val(),

clientId: null

};

}

</script>

@(Html.Kendo().AutoCompleteFor(m=>m)

.HighlightFirst(true)

.Filter(FilterType.StartsWith)

.Height(500)

.Placeholder("Select Debtor")

.DataTextField("Name")

.DataSource(source =>

{

source.Read(read =>

{

read.Action("ReadDebtorSearch", "PendingBatchListing")

.Data("onAdditionalDataDebtorSearch");

})

.ServerFiltering(true);

})

.MinLength(5)

.Template(

"<span>" +

"#=data.Name# | #=data.City#, #=data.State#" +

"</span>"

)

Grid

answered on 24 Apr 2015

1 answer

133 views

Persist state - data source urls

Hi

We are using the grid getOptions/setOptions to persist the users filters, column settings etc to a cookie

An issue we now have is it seems to persist everything including the datasource urls for read/update. This is an issue for us as we use custom MVC routes which look something like this: /jobs/1234/deliverable so the id is embedded into the url. When this is persisted the grid ends up querying data for a previously used Id.

What is the best way to prevent persisting the datasource url information and always use the URL as defined in the html page?

We have managed to get it working by doing this:

function loadGridState(grid, sessionKey) {

var options = localStorage[sessionKey];

if (options) {

var parsedOptions = JSON.parse(options);

parsedOptions.dataSource.transport.read = grid.dataSource.transport.options.read; //dont persist datasource urls

grid.setOptions(parsedOptions);

}

Is there a better way to do this and is there anything else we should be preventing (e.g. update, delete) if this were to be a generic function for the entire project?

One other strange we noticed is the object stored from getOptions is a slightly different structure to that directly on the grid.

E.g. the Grid has dataSource.transport.options.read but the getOptions stores dataSource.transport.read

Thanks

Andy

Grid

answered on 24 Apr 2015

1 answer

299 views

Limit displayed Multiselect items

I would like to limit the number of items I show in the multiselect control. Anyone have any examples of this? Perhaps with an ellipse or an expander of some sort.

MultiSelect

answered on 23 Apr 2015

2 answers

160 views

Edit Read Only columns with javascript

Hi,

I have a few columns defined that I don't want the user to change.

When they click a button, it calls a service which returns data. I want to update the columns with this data.

The problem is, if they're set to read-only, I can't change them, and the databound event never fires

.Events(e => e.DataBound("dataBound"))

.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.Events(events => events.Error("error_handler"))
.Model(model =>
{
model.Id(p => p.SnapshotDefinitionID);
//model.Field(p => p.NextSnapshotQueueID).Editable(false);
//model.Field(p => p.NextSnapshotQueueTime).Editable(false);
model.Field(p => p.LastSnapshotQueueID).Editable(false);
model.Field(p => p.LastSnapshotQueueTime).Editable(false);

model.Field(p => p.NextScheduleID).Editable(false);
model.Field(p => p.NextScheduleTime).Editable(false);
model.Field(p => p.LastScheduleID).Editable(false);
model.Field(p => p.LastScheduleTime).Editable(false);

model.Field(p => p.SnapshotQueueCount).Editable(false);
model.Field(p => p.ScheduleCount).Editable(false);

//model.Field(p => p.Client).DefaultValue(
// ViewData["defaultClient"] as DropDownListViewModel);
})
.Create(update => update.Action("BulkCreate", "SnapshotDefinition"))
.Read(read => read.Action("BulkRead", "SnapshotDefinition", new { clientId = @Request["ClientID"], snapshotDefinitionID = @Request["SnapshotDefinitionID"] }))
.Update(update => update.Action("BulkUpdate", "SnapshotDefinition"))
.Destroy(update => update.Action("BulkDestroy", "SnapshotDefinition"))

Grid

answered on 23 Apr 2015

2 answers

175 views

Redirect to strongly typed view based on grid selection

When a user selects a row in my grid, I can get the dataItem from a button click as follows:

$("#viewApplicationBtn").on("click", function () {
var grid = $("#Grid").data("kendoGrid");
var gridData = grid.dataItem(grid.select());

What I would like to do from this point is post this back to my controller, let the MVC model binder map to my ViewModel, and then redirect to another view which is of that model type.

The roadblock I'm facing is that an ajax post won't accomplish this and I can't pass the properties in a Url.Action helper because there are too many

here is my ajax:

$.ajax({
type: "POST",
url: "@Url.Action("ValidateModel")",
datatype: "json",
contentType: "application/json",
data: JSON.stringify(gridData),
success: function(data) {
window.location.href = @Url.Action("Details", "GridController");
},
error: function(data) {
console.log("post failed");
}
});

So how can I use my grid selection to post to another view with a Model?

Grid

answered on 23 Apr 2015