0
votes

How to Display the Selected Item from Database in Kendo Grid while click the Edit Button **My Coding Like**

var grid= $("#DivUser").kendoGrid(
{
dataSource: DataSource4,
scrollable: true,
sortable: true,
filterable: false,
reorderable: true,
resizable: true,
pageable: true,
toolbar: [ { text : "Add new record", name: "popup",
iconClass: "k-icon k-add"} ],
editable : {
mode : "inline"
columns: [

                {
                    field: "LoginName",
                    title: "Login Name",
                    width:"175px"
                },


                     {
                    field: "ScopeId",
                    title: "Scope Id",
                    editor: ScopeDropDownEditor
},

{
command: ["edit", "destroy"],
title: " ",
width: "175px"
}
]
}).data("kendoGrid");

var DataSourceScope = new kendo.data.DataSource( { transport: { read: { url: "WebServices/Project.asmx/GetScope", data: "{}", contentType: 'application/json; charset=utf-8', type: 'POST', dataType: 'json' }, parameterMap: function(options, operation) { if (operation == 'read') return kendo.stringify(options); } }, schema: { data: function(Data) { return (Data.d); }, model: { id: "ScopeId", fields: { ScopeId: { type: "number"}, ScopeName: { type: "string"} } } }, error: function(e) {<br> var xhr = e[0]; var statusCode = e[1]; var errorThrown = e[2]; alert('DataSourceScope - ' + xhr + ', ' + statusCode + ', ' + errorThrown); }<br> }); function ScopeDropDownEditor(container, options) { $(' data-bind="value:' + options.field + '"/>') .appendTo(container) .kendoDropDownList( { autoBind: false, dataSource: DataSourceScope }); } `

in my webservice code like

 public class Scopes
  {
      int _ScopeId;
      string _ScopeName;

      public int ScopeId
      {
          get { return _ScopeId; }
          set { _ScopeId = value; }
      }

      public string ScopeName
      {
          get { return _ScopeName; }
          set { _ScopeName = value; }
      }

      public Scopes() { }

      public Scopes(int ScopeId, string ScopeName) { this.ScopeId = ScopeId; this.ScopeName = ScopeName; }



}

  [WebMethod]
  public List<Scopes> GetScope()
  {

      string StrConnectionString = ConfigurationManager.ConnectionStrings["sample"].ConnectionString;
      SqlConnection SqlConnection1 = new SqlConnection(StrConnectionString);
      SqlCommand SqlCommand1 = new SqlCommand("select distinct ScopeId,(select ScopeName from Scope2 where Scope2.ScopeID=User2.ScopeId)as ScopeName from User2", SqlConnection1);

      DataTable DataTable1 = new DataTable();
      SqlDataAdapter SqlDataAdapter1 = new SqlDataAdapter(SqlCommand1);
      SqlDataAdapter1.Fill(DataTable1);

      List<Scopes> ListScope = new List<Scopes>();
      foreach (DataRow DataRow1 in DataTable1.Rows)
      {
          ListScope.Add(new Scopes(Convert.ToInt32(DataRow1["ScopeId"]), Convert.ToString(DataRow1["ScopeName"])));
      }

      return ListScope;

  }

this is Ok.. But after Click Edit button the dropdownlist items like 1st item for Example

ScopeName id dropdownlist items Admin, Developer,tester

in database james is tester if i click Edit Button Means

Name ScopeName
James admin
developer
tester

How to Bind and How i displya the SElected items? thankx in advance.

1

1 Answers

0
votes

edited

fetch data directly using java script

 var xhReq = new XMLHttpRequest();
 xhReq.open("POST", 'WebServices/Project.asmx/GetScope', false);
 xhReq.send(null);
 var DataSourceScope = JSON.parse(xhReq.responseText);

 function ScopeDropDownEditor(container, options) 
    {
    $('<input name="' + options.field + '"/>').appendTo(container).kendoDropDownList({
                            dataTextField: "ScopeName",
                            dataValueField: "ScopeId",
                            dataSource: DataSourceScope.d

                        });
    }