[CLOSED] Adding a new grid record

  1. #1

    [CLOSED] Adding a new grid record

    I am using MVC and Razor and I am trying to create a new record. Here is my store:

    .Store(Sub(str)
                                                                 str.Add(Html.X.Store().ID("tmStore").AutoLoad(True) _
                                                                         .Model(Sub(mdl)
                                                                                        mdl.Add(Html.X().Model.Fields(Sub(fields)
                                                                                                                              fields.Add(Html.X.ModelField.Name("CWTeamID").Type(ModelFieldType.Int))
                                                                                                                              fields.Add(Html.X.ModelField.Name("Name"))
                                                                                                                              fields.Add(Html.X.ModelField.Name("DrafterEmployeeID").Type(ModelFieldType.Int))
                                                                                                                              fields.Add(Html.X.ModelField.Name("ReviewerEmployeeID").Type(ModelFieldType.Int))
                                                                                                                              fields.Add(Html.X.ModelField.Name("CorrespondentEmployeeID").Type(ModelFieldType.Int))
                                                                                                                              fields.Add(Html.X.ModelField.Name("QAReviewerEmployeeID").Type(ModelFieldType.Int))
                                                                                                                      End Sub))
                                                                                End Sub) _
    Here is my JavaScript:
    function addTeam() {
            var grid = App.TeamGrid;  //$("#TeamGrid");
            debugger;
    
            var r = Ext.ModelManager.create({
            CWTeamID:0,
            Name:'New Team',
            DrafterEmployeeID: 0,
            ReviewerEmployeeID: 0,
            CorrespondentEmployeeID: 0,
            QAReviewerEmployeeID: 0
            }, 'Team');
    
            grid.store.insert(0,r);
            grid.editingPlugin.startEdit(0,0);
        }
    Now in looking in the page source, the store gets defined like this:
    Ext.create("Ext.grid.Panel", {
        store: {
            model: Ext.define(Ext.id(), {
                extend: "Ext.data.Model",
                fields: [{
                    name: "CWTeamID",
                    type: "int"
                }, {
                    name: "Name"
                }, {
                    name: "DrafterEmployeeID",
                    type: "int"
                }, {
                    name: "ReviewerEmployeeID",
                    type: "int"
                }, {
                    name: "CorrespondentEmployeeID",
                    type: "int"
                }, {
                    name: "QAReviewerEmployeeID",
                    type: "int"
                }]
            })

    When I try to run the code, I get this error:
    TypeError: c is not a constructor


    Since this is generated in Razor, I am not sure what the 'Team' parameter (in Javascript) value should really be. However, I have tried a variety of values, including nothing, with all generating the same error as above.

    Additionally, my grid uses a combobox in edit mode. I would like the same effect during the add. The value zero is not amoung the set of values in my store. So, how can I basically get null value comboboxes in the place of all the ID fields? And finally, how can I validate the data entered (all is required) once the data is entered?
    Last edited by Daniil; Jun 04, 2012 at 7:42 PM. Reason: Please use [CODE] tags for all code, [CLOSED]
  2. #2
    Hi,

    You should set up ID for the Model (for example, "Model1") and use it within the create method.
    Ext.create('App.Model1', {
        test1: 'new 1',
        test2: 'new 2',
        test3: 'new 3'
    });
    Additionally, my grid uses a combobox in edit mode. I would like the same effect during the add. The value zero is not amoung the set of values in my store. So, how can I basically get null value comboboxes in the place of all the ID fields? And finally, how can I validate the data entered (all is required) once the data is entered?
    Please keep one issue per thread.
  3. #3
    I have updated my model to this:
    .Model(Sub(mdl)
                       mdl.Add(Html.X.Model.Fields(Sub(flds)
                                                           flds.Add("Selected", Ext.Net.ModelFieldType.Boolean)
                                                           flds.Add("Text")
                                                           flds.Add("Value", Ext.Net.ModelFieldType.Int)
                                                   End Sub) _
                                                  .IDProperty("Value") _ 
                                                  .ID("mdlTeam"))
               End Sub))
    I have changed my Javascript to this:
     var r = Ext.create('mdlTeam',{
            CWTeamID:0,
            Name:'New Team',
            DrafterEmployeeID: 0,
            ReviewerEmployeeID: 0,
            CorrespondentEmployeeID: 0,
            QAReviewerEmployeeID: 0
            });
    Now, I receive this error:
    Ext.Loader is not enabled, so dependencies cannot be resolved dynamically. Missing required class: mdlTeam
  4. #4
    A small update:

    I found the .Loader property on the grid and have configured this much
    .Loader(New Ext.Net.ComponentLoader() With {.Enabled = True, .ClientIDMode = ClientIDMode.Static, .AutoLoad = True, .AutoDataBind = True, .Mode = LoadMode.Data}) _
    What I need to understand now is how this needs to interact with my proxy and how I use this to call the ajax methods in my controller.
    (I am assuming that "autoload=true" causes it to "auto postback")
  5. #5
    Hi,

    1. If you want to create records of particulat model type then you have to set ID for model but it is better to set Name
    <ext:Model Name="Employee" ...
    2. After that you can create record using Ext.create
    - Please note that if you use ID then on client side need to use ClientID, ClientID can be different due namespace using (for example, if ID="TestModel" then need use Ext.create('App.TestModel', ...). Therefore Name option is better, it is always predictable on client side
    - 'add' and insert methods of Store can understand pure objects instead record (record will be created automatically)

    store.insert(0, {
        CWTeamID:0,       Name:'New Team',
           DrafterEmployeeID: 0,
           ReviewerEmployeeID: 0,
           CorrespondentEmployeeID: 0,
           QAReviewerEmployeeID: 0
    });
    Vladimir Shcheglov
    Sr. Developer
  6. #6
    Now, I receive this error:
    Ext.Loader is not enabled, so dependencies cannot be resolved dynamically. Missing required class: mdlTeam
    The exception occurs because you pass incorrect model name to Ext.create, i guess it should be 'App.mdlTeam' instead 'mdlTeam'
    Vladimir Shcheglov
    Sr. Developer
  7. #7
    Ok. I am finally getting back to this and I can now get a record to "insert." However, I am hitting some roadblocks. First, the "insert" action fires my server-side code as I have AutoSync set to true, but this isn't really the way I want I am trying to accomplish - at least not on the "Add" button click. Instead, on "Add" click, I simply want a new (blank) record in my grid that the user can enter data. Then, when done, they can click "update" (I am using the RowEditing plugin), that will call my my server-side code. Additionally, when the store calls my server-side code, I need to know what my function should look like. Right now, even wrapping the grid in a form, I am getting nothing in my form collection and my querystring reads "[object Object],[object Object],[object Object],[object Object]." I know you are bundling up JSON, but how do I retrieve it?
  8. #8
    Quote Originally Posted by adelaney View Post
    First, the "insert" action fires my server-side code as I have AutoSync set to true, but this isn't really the way I want I am trying to accomplish - at least not on the "Add" button click. Instead, on "Add" click, I simply want a new (blank) record in my grid that the user can enter data. Then, when done, they can click "update" (I am using the RowEditing plugin), that will call my my server-side code.
    Then, I think, you should not use
    AutoSync="true"
    and call the Store sync method explicitly.
    http://docs.sencha.com/ext-js/4-1/#!...re-method-sync

    Quote Originally Posted by adelaney View Post
    Additionally, when the store calls my server-side code, I need to know what my function should look like. Right now, even wrapping the grid in a form, I am getting nothing in my form collection and my querystring reads "[object Object],[object Object],[object Object],[object Object]." I know you are bundling up JSON, but how do I retrieve it?
    Please investigate the following examples.
    http://examples2.ext.net/#/GridPanel...s/StoreEvents/
    http://examples2.ext.net/#/GridPanel...reCustomLogic/
    http://examples2.ext.net/#/GridPanel...s/HttpHandler/
    http://examples2.ext.net/#/GridPanel...ns/WebService/
  9. #9
    Quote Originally Posted by Daniil View Post
    Then, I think, you should not use
    AutoSync="true"
    and call the Store sync method explicitly.
    http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.AbstractStore-method-sync
    You can still use
    AutoSync="true"
    if set up
    AllowBlank="false"
    for ModelFields or set up Validations.
    http://examples2.ext.net/#/GridPanel/Update/AutoSave/

Similar Threads

  1. [CLOSED] Adding New Record at run time
    By jesperhp in forum 1.x Premium Help
    Replies: 4
    Last Post: Feb 27, 2012, 12:17 PM
  2. [CLOSED] Insert Record into grid
    By sharif in forum 1.x Premium Help
    Replies: 2
    Last Post: Apr 08, 2010, 2:16 PM
  3. [CLOSED] [1.0] Store adding record
    By state in forum 1.x Premium Help
    Replies: 14
    Last Post: Dec 11, 2009, 6:24 PM
  4. Replies: 5
    Last Post: May 15, 2009, 7:40 AM
  5. Adding one record in a grid
    By nuno_Santos in forum 1.x Help
    Replies: 1
    Last Post: Apr 14, 2009, 5:55 PM

Tags for this Thread

Posting Permissions