CODEWITHSUNDEEP
javascriptjqueryjquery-uijqgridjquery-widgets
vittochan
vittochan

Reputation: 685

Add row into jqGrid without reload the page

I have a jqGrid with "local" source (an array).

I added a button to add a row using this code:

This is the button code:

$("#btnAddCategory").button().click(function(event) {
    var newRowId = $.jgrid.randId("new");
    $("#tableCategories").addRowData(newRowId, {
        nome : "prova",
        squadre : 16,
        minutaggio : 40
    }, "last");
});

This is the HTML where there are buttons definitions:

<form id="frmTCstepCategorie">
    <fieldset class="ui-widget ui-widget-content">
        <legend class="ui-widget">
            Categorie
        </legend>
        <table id="tableCategories">
            <tr>
                <td></td>
            </tr>
        </table>
        <div style="margin-top: 10px" class="categoriesNav">
            <button id="btnAddCategory">
                Aggiungi
            </button>
            <button id="btnDelCategory">
                Rimuovi
            </button>
        </div>
    </fieldset>
</form>

It works, but after the insert, the page are reloaded.

How can I add a row without page reloading?

Upvotes: 0

Views: 1166

Answers (2)

rtf_leg
rtf_leg

Reputation: 1819

May be your button is submit button or some code after adding a row causing page reload.

Try to set type of your button like this

type="button"

or add 

return false;

at the end of button click handler.

Upvotes: 1

ItayB
ItayB

Reputation: 11337

you can add the following line to your jqgrid table:

loadonce: true

Upvotes: 0

Related Questions