locked
how to trace mvc webgrid this way? RRS feed

  • Question

  • User-1651604128 posted

    I have a MVC web app using webgrid to display data,

    on the bottom of the webgrid, there is a HTML form used to display each row of webgrid data when user click one row of webgrid.

    so when one row is selected, it will be highlighted and the associated data is showing on the bottom of html form.

     I am OK with this by using ajax call.

    But I am asked to add Previous and Next button on the bottom of the html form, so when user click Previous (Next) button, the highlighted row will move to Previous (Next) row, and the associated data will be displayed on the same form.

    Can anybody have any idea or example code of doing this? much appreciated.

    Monday, January 14, 2019 9:57 PM

All replies

  • User1520731567 posted

    Hi Peter Cong,

    But I am asked to add Previous and Next button on the bottom of the html form, so when user click Previous (Next) button, the highlighted row will move to Previous (Next) row, and the associated data will be displayed on the same form.

    What does this mean?

    Do you mean the highlighted line will change as Previous (Next) button click?

    Could your please post your code(complete code),so that i can reproduce your issue and understand your mean better.

    Best Regards.

    Yuki Tao

    Tuesday, January 15, 2019 7:59 AM
  • User-1651604128 posted

    Yuki Tao

    Hi Peter Cong,

    Peter Cong

    But I am asked to add Previous and Next button on the bottom of the html form, so when user click Previous (Next) button, the highlighted row will move to Previous (Next) row, and the associated data will be displayed on the same form.

    What does this mean?

    Do you mean the highlighted line will change as Previous (Next) button click?

    Could your please post your code(complete code),so that i can reproduce your issue and understand your mean better.

    Best Regards.

    Yuki Tao

    Hi Yuki, Sorry for the confusing..., here is the details:

    To make it simple, basically, a webgrid with the data showing on the razor view, user click any row of webgrid, that row will be highlighted (I can do this), and the click event will call back the method of controller to show the details on a html form below the webgrid (I am also OK with this).

    Now, I want to add two buttons (Previous , Next) on the bottom of the HTML form, so click each button, first it will find the current selected row and then move one row before or after the current selected row, and at the same time, the new selected row of data will be showing on the html form, basically, an ajax call will be used here, but can not figure out how to do it.

    Please let me know if you have any further question, thanks again.

    Tuesday, January 15, 2019 12:57 PM
  • User475983607 posted

    If you need help completing your work task, please post the source code as requested.  You've been on these forums for a long time.  IMHO, you should understand that we need to source code in order to provide an accurate solution.  Otherwise, we are guessing.  Also remember to post the code you have written so far to accomplish this requirement.

    Tuesday, January 15, 2019 1:16 PM
  • User1120430333 posted

    Ajax has nothing to do wit this. The rows showing are on the grid. You are moving up and down selecting a row on the grid to highlight. You can't move above the first row  that's showing on the grid  page, and you can't go beyond the last row showing on the grid page  based on number of rows showing on a grid page.

    https://docs.microsoft.com/en-us/dotnet/api/system.web.helpers.webgrid?view=aspnet-webpages-3.2

    You're going to have to use jQuery and JavaScript, move up and down rows and select the row for highlight.

     The link should give you a clue.

    http://burnignorance.com/javascript-performance-tips/select-the-previous-or-next-row-of-the-grid-on-button-click/

    Tuesday, January 15, 2019 1:27 PM