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. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Webpack error in ej.pager.min.js: Invalid left-hand side in assignment expression (10:5715)

Thread ID:





130468 May 11,2017 06:07 PM UTC May 15,2017 12:42 PM UTC JavaScript 3
Tags: ejGrid
Asked On May 11, 2017 06:07 PM UTC


Webpack 2.2.0 throws error with babel loader 6.2.3 and typescript 2.2.1:

ERROR in ./~/syncfusion-javascript/Scripts/ej/web/ej.pager.min.js
    Module build failed: SyntaxError: /node_modules/syncfusion-javascript/Scripts/ej/web/ej.pager.min.js: Invalid left-hand side in assignment expression (10:5715)

Could you please check syncfusion-javascript 15.2.40?


Sasikala Nagarajan [Syncfusion]
Replied On May 12, 2017 06:13 AM UTC

Hi Nga,    
Sorry for the inconvenience caused.  
We would like to inform that; we have already fixed this issue (pager error) and published the updated source with 15.2.41 version of syncfusion-javascript.   
Please check with updated source and let us know if you need any further assistance.  
Sasikala Nagarajan   

Replied On May 12, 2017 08:36 AM UTC

Thank you. The new version works with webpack. I have a question on Grid:

The datasource is [              { OrderId: 1, ProductId: 1, Quantity: 2}            ]

I would like the field ProductId to display the product name on the grid. And user can edit the field by selecting value from a dropdown list. The dropdownlist should show both columns product id and name and user can search on that dropdownlist. Is that possible and how to do that?


Mani Sankar Durai [Syncfusion]
Replied On May 15, 2017 12:42 PM UTC

Hi Nga, 

Thanks for contacting Syncfusion support. 

We have analyzed your query and we have prepared a sample based on your requirement that can be downloaded from the below link. 

In this sample we have shown the dropdown list for the particular column with two column values. This can be achieved using editTemplate property of columns in grid and with template property of dropdown list.  

Refer the code example. 
<style type="text/css"> 
          .eheader { 
              font-weight: bold; 
              border-bottom: 1px solid #c8c8c8; 
              background: #c8c8c8; 
    <div id="Grid"></div> 
       <script type="text/babel"> 
                            var pageSettings = { pageSize: 4 }; 
              var editSettings = { allowEditing: true, allowDeleting: true, allowAdding: true }; 
              var toolbarSettings = { showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.Add, ej.Grid.ToolBarItems.Edit, ej.Grid.ToolBarItems.Delete, ej.Grid.ToolBarItems.Update, ej.Grid.ToolBarItems.Cancel]}; 
        var columns = [ 
        { field: "OrderID", headerText: "OrderID",isPrimaryKey:true, width: 90 }, 
        { field: "CustomerID", headerText: "Last Name", width: 90 }, 
        { field: "EmployeeID", headerText: "EmployeeID",foreignKeyField: "EmployeeID", foreignKeyValue: "FirstName", dataSource: window.employeeView,editTemplate:{create:"create",read:"read",write:"write"}, width: 90 }, 
                      <div id="Grid2"> 
                                           <EJ.Grid id="Grid_1" dataSource = {window.gridData} editSettings={editSettings} toolbarSettings={toolbarSettings} allowPaging = {true} columns={columns} pageSettings={pageSettings} > 
          function create() { 
              return $("<input>"); 
          function write(args) { 
              var gridObj = $(".e-grid").ejGrid("instance"); // Get grid object  
              var val = ej.isNullOrUndefined(args.rowdata["EmployeeID"]) ? "" : args.rowdata["EmployeeID"]; 
                  width: "100%", dataSource: args.column[2].dataSource, value: args.rowdata.EmployeeID, fields: { text: "FirstName", value: "EmployeeID" }, 
                  headerTemplate: "<div class='eheader'><span>FirstName</span> <span class='emp'>EmployeeID</span></div>", 
                 template: '<div><div class="ename"> ${FirstName} </div>' + '<div class="desig"> ${EmployeeID} </div><div>',    //bound firstName value which is the foreignkeyvalue for employeeID column and with employeeID value 
          function read(args) { 
              return args.ejDropDownList("getSelectedValue");   //return the selected value in dropdown list 

From the above code example we have used foreign key column and bound the foreign key value for that column. Also in dropdown list we have shown foreign key value as FirstName and Foreign key Field EmployeeID using template property. 
Refer the screenshot below. 

Refer the documentation link 

Please let us know if you need further assistance. 

Manisankar Durai. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon