Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1910
Add row when button is pressed
posted

I have a WebDataGrid and am able to add a row if I insert the data and tab off or hit the enter key, but I have a save button outside of the grid that the users are used to pressing after they have updated existing records and I want them to be able to press this button when they have inserted new data to add a new row. Any suggestions?

  • 4315
    Offline posted

    Hi, Algunderson.

    If I understood you right, what you want to achieve is to add one or more rows to the grid and then by pressing Save button to send the new data to the server. If you want this you can check this sample.

    By default when you add a row to the grid after the new row looses focus, it automatically makes a postback to the server and saves the new row data in the data source. If you want to update several rows at once, without an automatic postback, you need to enable BatchUpdating behavior of the grid. With this behavior enabled, when the new row looses focus, no automatic postback happens. The save of the new data into the data source happens when you make the first postback to the server. The sample above shows you exactly that. I hope this will help you and if you have other questions, don't hesitate to ask them.

    Best regards,
    Nikolay

    • 1910
      Offline posted in reply to Nikolay Alipiev

      I looked at the sample, but it doesn't seem to do what I'm trying to accomplish. I was hoping that once I entered data into the "Add" row, I would be able to press the "Submit Data" button and the data would be saved to the grid...but it isn't. It seems to only save the newly added row if the tab or enter keys are pressed. Is there any way to get the new row added simply by pressing the "submit" button?

      • 33839
        posted in reply to Angela Gunderson

        Hi algunderson,

        Assuming the data is in the add row, call $find("WDG1").get_behaviors().get_editingCore().get_behaviors().get_rowAdding()._commitRow();

        regards,
        David Young 

        • 1910
          Offline posted in reply to [Infragistics] David Young

          Here is what my code looks like:

          <script type="text/javascript" id="igClientScript">
          function btnSave_Click(oButton, oEvent){
          $find(
          "grid").get_behaviors().get_editingCore().get_behaviors().get_rowAdding()._commitRow();
          </script>

          My grid is here and is named "grid".

          and my button is here:

          <igtxt:WebImageButton ID="btnSave" runat="server" Text="Save">
          <ClientSideEvents Click="btnSave_Click" />
          </igtxt:WebImageButton>

          For some reason, it isn't working though. Am I doing something wrong?

          • 4315
            Offline posted in reply to Angela Gunderson

            Hi, Algunderson.

            You can check if this isn't your problem. You need to call:

            $find("<%=grid.ClientID%>") instead of $find("grid"), if your control isn't with static id.

            As far as about the sample that I sent you, the row is added but it's in the end of the grid at the last page, that's why you cannot see it. Do you want to have seperate "Save"  button for every row or one for the whole grid?

            Thanks,
            Nikolay

            • 1910
              Offline posted in reply to Nikolay Alipiev

              I made the change you suggested (<%=grid.ClientID%>)...but now it's working too well! It is actually saving the record twice now.

              I have one save button for the whole grid.

              • 4315
                Offline posted in reply to Angela Gunderson

                Hi again, Algunderson.

                This is happening because you don't have BatchUpdating behavior enabled. In this way when you finish editing the new row it will automatically make a postback to the server and will save the row data. And after you click "Save" the data will be saved again. 

                Again I will suggest you to use Batch Updating without even calling _commit() method, because with Batch Updating, to save the data into the data source you only need to have one button that will make simple postback to the server. The grid will handle this internally. It will be good for you because you have only one "Save" button for the whole grid. So to change your code just enable Batch Updating of the WebDataGrid and set the WebImageButton property AutoSubmit to true, if not set by default. 

                The other option is to attach to the EditingClientEvents-RowAdding client-side event of the WebDataGrid and cancel it. Then the automatic postback will not happen and by clicking "Save" button you will have only one row added. All this is if you don't have BatchUpdating enabled.

                <ig:EditingCore EditingClientEvents-RowAdding="cancelRowAdding">

                 

                In JavaScript, define the handler:

                 

                function cancelRowAdding(sender, e){

                    e.set_cancel(true);

                }

                There is third possible way if you like it - using Row Editing Template.

                Best regards,
                Nikolay