Add custom button and textbox in toolbar grid

[Dan]

Hi,

I want to add a custom button and textbox in toolbar grid, the custom button should process only the rows where the checkbox are checked and the value that user putted in the textbox should to pass like parameter to the controller when the custom button is clicked. How can to do that?

Thanks

[Manivel Sellamuthu]

Hi Dan, 

Greetings from Syncfusion support. 

From your query we are unable to get your exact requirement. Could you please share explain more about your requirement clearly, which will help us to analyze and provide a better suggestion as soon as possible 

Regards, 

Manivel 

[Dan]

Hi Dan, 

Greetings from Syncfusion support. 

From your query we are unable to get your exact requirement. Could you please share explain more about your requirement clearly, which will help us to analyze and provide a better suggestion as soon as possible 

Regards, 

Manivel 

Hi,

I wanted  something like that:

When I click on the "Generate" button the orders than are selected must be processed, and I want to save in the database the description that was wrote in the textbox "Description"

[Shalini Maragathavel]

Hi Dan, 

 

Sorry for the late reply. 

 

Based on your query we understand that you want to retrieve the selected rows and save the textbox value in the datasource on button click. You can achieve your requirement by using toolbarClick event of Grid.  

 

In the toolbarClick event you can get the selected rows using getSelectedRecords() method and you can able to receive the text inside the text box on the server using ajax call. 

 

function toolbarClick(args) { 

         

        var gridobj = document.getElementById("CheckboxSelection").ej2_instances[0]; 

        if (args.item.id === 'generate') { 

 

            var selectedRow = gridobj.getSelectedRecords();//to get the selected rows 

 

            console.log(selectedRow); 

        

            var text = document.getElementById('textbox'); 

 

            var textval = text.value; //to get value inside the textbox 

 

            console.log(textval); 

 

            var ajax = new ej.base.Ajax(); 

 

            ajax.type = "POST" 

 

            ajax.url = "/Home/Description" 

 

            var moveposition = { textval: textval };  

 

            ajax.data = JSON.stringify(moveposition); 

 

            ajax.send(); 

 

            

 

        } 

     

    } 

HomeController.cs  

 

public  void Description(description des) 

        { 

 

             

            var value = des;  

      /*your code*/ 

 

 

        } 

We have created the sample based on your requirement. please find the sample here. 

Sample : https://www.syncfusion.com/downloads/support/forum/156412/ze/SyncfusionMvcApplication2-116691649.zip 

 

API Link: https://ej2.syncfusion.com/angular/documentation/api/grid/#getselectedrecords 

                https://ej2.syncfusion.com/angular/documentation/api/grid/#toolbarclick 

 

Please get back to us, if you need any further assistance. 

Regards, 

Shalini M.