jQuery UI Widgets Forums Angular How to perform redirect through a button in grid

This topic contains 5 replies, has 2 voices, and was last updated by  Ivo Zhulev 7 years, 1 month ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author

  • praneeth
    Participant

    I am trying to build a crud application which has a jq grid and each cell has an edit button.When I click on the edit button I should redirect to my edit screen through routerlink like this,

    routerLink = ‘user/edit/11’

    But unfortunately routerlink is not working with edit,only href is working.Which refresh to go to edit.But as these widgets are of angular 2 routerLink should be working.

    Here is my code,
    var Action = function (row, columnfield, value, defaulthtml, columnproperties) {
    return ‘<button routerLink = ‘user/edit/1’>EDIT</button>
    }

    this.columns =
    [
    {
    text: ‘S.No’, columntype: ‘textbox’, filtertype: ‘input’, datafield: ‘id’, width: 50, cellsalign: ‘center’
    },
    {
    text: ‘UserName’, columntype: ‘textbox’, filtertype: ‘input’, datafield: ‘user_name’, width: 100
    },
    {
    text: ‘Email’, columntype: ‘textbox’, filtertype: ‘input’, datafield: ’email’, width: 100
    },
    {
    text: ‘ServiceType’, columntype: ‘textbox’, filtertype: ‘input’, datafield: ‘servicetype’, width: 50
    },
    {
    text: ‘Action’, columntype: ‘textbox’,datafield: ‘id’, width: 215, cellsrenderer: Action
    }]

    Can anyone please help me.Thanks.


    Ivo Zhulev
    Participant

    Hi praneeth,

    As I understand, you want to redirect on a button click. So you must place your redirect code in the click event. This is not jQwidgets, just simple event. To redirect in Angular you must use this.router.navigate(['/YOURVIEW']);. Are you using this, and if yes please share me the code you have in your click event body.

    Best Regards,
    Ivo

    jQWidgets Team
    http://www.jqwidgets.com/


    praneeth
    Participant

    Hi Ivo Zhulev,

    I am putting the routerLink directly in my html the problem is this is not getting triggered.

    var Action = function (row, columnfield, value, defaulthtml, columnproperties) {
    return ‘<button routerLink = ‘user/edit/1’>EDIT</button>
    }


    Ivo Zhulev
    Participant

    Hi praneeth,

    That’s because the code you write in here is interpreted like a normal HTML, not an Angular. So the way to do this is to attach a click event and in it use router.navigate.

    Best Regards,
    Ivo

    jQWidgets Team
    http://www.jqwidgets.com/


    praneeth
    Participant

    Hi Ivo Zhulev,

    The problem is (click) is not even working since it is an normal HTML.Can you please suggest any help.


    Ivo Zhulev
    Participant

    Hi praneeth,

    Is the answer i gave you here:
    http://www.jqwidgets.com/community/topic/how-to-use-cell-rendering/#post-93207
    the one you need here?

    Best Regards,
    Ivo

    jQWidgets Team
    http://www.jqwidgets.com/

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.