Kendo Grid Page Persistence - asp.net-mvc-5

This is a more conceptual question, so I'm not initially submitting any code for it unless someone requests it.
On a current website of mine, I am using a Kendo UI grid to display a table of multiple pages. I also have a (Kendo UI) drop down list, allowing the user to filter rows by class (it reloads the page and makes the necessary edits through the controller).
My problem is this: when the user pages through the Kendo UI grid, it loads a new page and the filtering preferences do not persist. How can I make it either not reload the page(and do everything on the same page instead), or make the drop down box's value persist? Thanks, and tell me if there's any information that would be helpful for me to add!
CLARIFICATION: The functionality is all fine, the only issue is that the dropdownlist does not visually persist.

Actually you can bind both dropdownlist and grid to a single external datasource. This datasource will actually place a ajax call and get the records when the value in drop down changes. As the new records appear in datasource the grid can be refreshed or will automatically refresh without the page reload. Page reload doesn't look like a clean way to filter the grid.

Related

Kentico V9 Confirm form submission with javascript history.back

My repeater has enough data where I see my pagination. When I view the detail transformation for any items after the first page, the history.back() button gives me the form submission error.
Short of hard coding the back button, what's the easiest solution to avoid this?
I assume the "history.back()" is your javascript? The pagination is most likely occurring through postback, and any navigation back will require that same post data being sent.
One option is you can make the pagination not postback, but instead URL based. In the "Paging" area of your repeater, set the Mode to "QueryString" and set a querystring key (like "page"). Try that!
Otherwise you will need to do a window.location = "/The/Previous/Url" so it won't event attempt a postback and will simply direct them to the page, but your page you were last on will be lost.
Wrap the webpart in an update panel. In the webpart you can check the box to do this very easy and leave the rest of your configurations the way they are. If other elements on the page require a postback or rely on that webparts values then you may have to wrap all of them in an update panel.

XPage not syncing properly with backend data on partial refresh

I have an XPage that displays fields in a document. I also have the ability to pop out a new window that displays those same fields. I'm implementing a document locking scheme so that the two instances can't cause conflicts (and this is how I'm testing it).
A problem I've run into is that when the user edits the document in the pop out and saves it, a partial refresh of the panel containing those same fields in the original page doesn't show the updated data.
The save in the pop out was successful, and I can see in the Notes client that the document does indeed have the new value, but the original page simply won't show the new value. A complete page refresh using the reload button in the browser works, but I'd like to trigger this programmatically and as quickly as possible, hence the partial refresh.
Does anyone know what is going wrong? Is the NotesXspDocument in the original page getting out of sync with the backend document? I read about document1.getDocument(true), but that doesn't seem to do anything.
(As usual, I can't supply source code unfortunately....)
Once the NotesXspDocument is loaded with the XPage, a partial refresh does not update the xspDoc from the back-end DB, but from the in-memory DataSource.
You will need to refresh the XPage:
Reload the url from browser or in ssjs with a context.reloadPage()

Opening different xpages forms from a view panel

I have an Xpages application that pulls data from another .nsf file. I have a view panel linked to a view in that db. The view has documents with several different forms in it. I want to be able to open each document in it's own form(xpage).
How do I write a computed At Runtime, open selected document using: statement that will select the correct Xpage to present the document.
If you use the Data View component instead of a View Panel, you can compute the pageName attribute, referencing the var attribute to return a different value for each row based on the document that row represents. The flexibility of the Data View component also makes it easier to make your app look more like a modern web application and less like an Excel spreadsheet. As an additional bonus, the mobile theme invokes a renderer that makes each Data View instance look like a native mobile list, so using Data Views instead of View Panels simplifies mobile development.
You have 2 options:
use "use xpage associated with form" and edit the form's property
use a SSJS formula to compute the Form. You provide a variable name in the view control var to access a view row as XSPViewEntry. If the Form is in a view column even one you don't display you use .getColumnValue otherwise getDocument.getItemValueString
Does that work for you?
Maybe this mothed can help you: Unable to get document page name for
Hope this helps
Mark
I had a similar problem today. I use only one form but 3 different xpages for associated with this form. I have 3 different document types in the view. I used rowData the get the type of the document.
try{
var v=rowData.getColumnValue("form");
if(v.indexOf("x")> -1){var page ="x.xsp"}
else if(v.indexOf("y") > -1){var page = "y.xsp"}
else{var page = "z.xsp"}
}catch(e){
var page = "x.xsp"
}
So to your view you can create a column with the value of the form and you can use it.
I have used the extension library Dynamic View control which has an event you can code to get a handle to the NotesViewEntry which was selected. See the demo database page Domino_DynamicView.xsp and the Custom Event Handler tab for an example.
Note, in 8.5.3 (I have not upgraded yet) if you add or edit the eventHandler for onColumnClick it will be added to the XPages source as an xe:eventHandler. It needs to be an xp:eventHandler to work. The way to do it is to copy the code in the source from the exiting event and delete it. Recreate the event and update the code. Then go back into the source and change the tags within the eventHandler to xp:.

Have to push button twice to get partial refresh to work

Background: Xpage with multiple data sources. Each row of tabbed table contains an edit panel bound to a different data source than the main page. Each page contains a table to enter new documents. These documents are children of the main document. There is a view control that shows the user created documents immediately. The button in the table saves the document in addition to adding some control fields. It does a partial refresh of the editPanel.
Recently I added validation to the fields in the entry table. I use a function, and prevent updating from anything but the button. I am using Tommy Valand's method from this blog post: http://dontpanic82.blogspot.com/2010/03/xpages-making-validation-behave.html. If I don't use Tommy's method, then the validators fire when switching tabs, and are useless.
All of this works sort of, but I am experiencing the following issues.
1) I have to push the button twice to get the partial refresh to fire. Not only that, but the validation messages to not fire until the button is pushed twice. The first part was still an issue prior to adding the validation.
2) The table values do not clear after the refresh does happen. This used to work prior to adding the validation. The only way to get the values to clear now, is to do a full refresh (F5).
I really just need partial refresh to behave like it should. Any help is greatly appreciated.
I am answering my own question because I think that I might have found out why the partial refresh was acting so flaky. Here is what I did that solved my issues: Each tab had an editPanel. If I make the edit panel do a partial refresh to itself then the buttons on that panel seems to behave as you would expect them to.
When I create a new core control panel, the default in No submission. I do not know whether this issue manifests itself only when using multiple data sources and/or tabbed tables. Hopefully this fix will be of use to someone down the road. It is worth a try if you are having issues with partial refresh working correctly.

Automatically add rows to a Data View?

I am using a Data View control and the Pager Add Rows control to allow the user to add more rows to the data view.
Can I extend the Pager Add Rows control to automatically add rows to the Data View when the user reaches the bottom of screen?
Yes, you can do that easily with jquery. if you master dojo you can probably do it in similar ways. but this example show jQuery.
add jQuery to your xpage
add a new custom scriptlibrary to your xpage
put below code in your custom scriptlibrary
Add a addPageRows control to your xpages and connect it to a repeat.
All set, try it out.
$(function(){
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height()){
$("[id$='pagerAddRows1_ar'],[id$='pagerAddRows2_ar']").click();
}
});
})
The jquery code will try and find pagerAddRows1_ar or pagerAddRows2_ar and if found will click the link automatically when you reach the bottom of screen.
You can actually use this code with any kind of pager or link you have on your xpage. just make sure your code click the right id.

Resources