We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

CustomToolBarItem breaks the grid after any Grid postbacks

Here is my current code...

GRID
<ej:Grid ID="gvRSVP" runat="server" AllowPaging="true" AllowTextWrap="true" OnServerToolBarClick="gvRsvp_ServerToolBarClick" OnServerRecordClick="gvRSVP_ServerRecordClick">
    <PageSettings PageSize="10"></PageSettings>
    <EditSettings AllowAdding="false" AllowDeleting="True" AllowEditing="True" EditMode="Dialog" ></EditSettings>
    <ToolbarSettings ShowToolbar="True" ToolbarItems="edit,delete">
<CustomToolbarItem>
<ej:CustomToolbarItem TemplateID="#rsvpToolbarMatch" />
</CustomToolbarItem>
</ToolbarSettings>
<Columns>
<ej:Column Field="RSVPID" Visible="false" IsPrimaryKey="true" />
<ej:Column Field="ALKID" Visible="false" />
<ej:Column Field="DisplayName" HeaderText="Name" Width="110px"/>
<ej:Column Field="Degree" HeaderText="Degree" TextAlign="Left" Width="110px" />
<ej:Column Field="Company" HeaderText="Business Name" TextAlign="Left" Width="115px" />
<ej:Column Field="DisplayAddress" HeaderText="Address" TextAlign="Left" />
<ej:Column Field="Specialty" HeaderText="Specialty" TextAlign="Left" Width="130px" />
<ej:Column HeaderText="Status" Template="True" TemplateID="#matchColumnTemplate" TextAlign="Center" />
</Columns>
</ej:Grid>

TEMPLATE
<script type="text/x-jsrender" id="rsvpToolbarMatch">
    <a rel='nofollow' href="#" class="e-toolbaricons glyphicons glyphicons-group match" title="Match" />
</script>

Everything looks great when the page first loads. But when I fire off the OnServerRecordClick or OnServerToolBarClick events, the page returns with the grid missing and a JavaScript error stating:

Uncaught TypeError: Cannot read property 'replace' of undefined       ej.web.all.min.js:10


I have removed everything from my template and placed only a line of text and tested - error. I even copy/pasted your  ToolBar Item Template demo code into my page and tested it - error. I have no visible JavaScript errors until I add the CustomToolBarTemplate tags. 

Please help! Im running close on a deadline and need to try and make this work



1 Reply

BM Balaji Marimuthu Syncfusion Team July 10, 2015 11:21 AM UTC

Hi Corey,

Thanks for using Syncfusion Products.

We considered this “Script error is occurred when using the TemplateID in CustomToolbarItem while triggered the serverside events” as an issue and a support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

We suggest you to use the below workaround solution to resolve your reported issue until then.
Sample: Sample


<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True" AllowGrouping="True"

            OnServerRecordClick="DefaultEvents_OnServerRecordClick" OnServerToolBarClick="DefaultEvents_OnServerToolBarClick" >

           <ClientSideEvents Load="load" />

           <ToolbarSettings ShowToolbar="True" ToolbarItems="add,edit">

               <CustomToolbarItem>

                    <ej:CustomToolbarItem TemplateID="#Refresh" />

               </CustomToolbarItem>

           </ToolbarSettings>


            . . . . .


      </ej:Grid>

<script>

        function load(args) {

            if (ej.isNullOrUndefined(this.model.toolbarSettings.customToolbarItems[0].templateID))

                this.model.toolbarSettings.customToolbarItems[0].templateID = "#Refresh";

        }
    </script>



By using Clientside events we have assigned the TemplateIdID to the customToolbarItems. Kindly try using the above code example and get back to us if you have any concerns.

Regards,
Balaji Marimuthu

Loader.
Live Chat Icon For mobile
Up arrow icon