Update row in Angular JS

Question

I am submiting a form using Angular JS and Web service. Here is code-

<table>
    <tr>
        <td style="text-align: right;">Name :
        </td>
        <td>
            <input type="text" id="txtEmpName" ng-model="EmpName" />
        </td>
    </tr>
    <tr>
        <td style="text-align: right;">Age :
        </td>
        <td>
            <input type="text" id="txtEmpAge" ng-model="EmpAge" />
        </td>
    </tr>
    <tr>
        <td style="text-align: right;">City :
        </td>
        <td>
            <input type="text" id="txtEmpCity" ng-model="EmpCity" />
        </td>
    </tr>
    <tr>
        <td colspan="2" style="text-align: center;">
            <input type="submit" id="btnSubmit" value="Submit" />
        </td>
    </tr>
</table>

I want to make these text boxes reusable on Edit i.e. on edit click corresponding rows item must be filled and the Save button should now be working like Update button. How can I do it? Alternatively How can I make row editable?

plase see this stackoverflow.com/questions/37513025/…

Hadi
– Hadi

2016-05-30 12:15:54 +00:00
Commented May 30, 2016 at 12:15 — Hadi
– Hadi, Commented May 30, 2016 at 12:15
well,that link does not help me any more.

Ritesh Gupta
– Ritesh Gupta

2016-05-30 12:59:39 +00:00
Commented May 30, 2016 at 12:59 — Ritesh Gupta
– Ritesh Gupta, Commented May 30, 2016 at 12:59

Saneesh B · Accepted Answer · 2016-05-31 04:02:07Z

Ideally you would wanna create the models as Employee.Name , Employee.Age , Employee.City

Now

    <table>
    <tr>
        <td style="text-align: right;">Name :
        </td>
        <td>
            <input type="text" id="txtEmpName" ng-model="Employee.Name" />
        </td>
    </tr>
    <tr>
        <td style="text-align: right;">Age :
        </td>
        <td>
            <input type="text" id="txtEmpAge" ng-model="Employee.Age" />
        </td>
    </tr>
    <tr>
        <td style="text-align: right;">City :
        </td>
        <td>
            <input type="text" id="txtEmpCity" ng-model="Employee.City" />
        </td>
    </tr>
    <tr>
        <td colspan="2" style="text-align: center;">
            <button type="button" id="btnSubmit" ng-click="saveEmployee()">{{Employee.id ? "Edit" : "Create"}}</button>
        </td>
    </tr>
</table>

In the Controller

    $scope.saveEmployee = function(){
        if($scope.Employee.id){
             // Id will be present for a existing employee
            // update the Employee
          }else {
             // Id not present
             // create the employee              
          }
    }

I would have an Employee.save() in the model which can identify weather to save or update the Employee

Collectives™ on Stack Overflow

Update row in Angular JS

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related