Add And Edit Form In One Page

I have two buttons 'Add' and 'Edit' in my page. When I try to click the 'Add' button I get one popup form and I fill the details and will be added in to the database. The same thin

Solution 1:

There are Multiple Way to do it, Next time Please Post the code. Let me assume that you were using the Model to view

https://jqueryui.com/dialog/#modal-form.

For more details post the code we can help you out

Here is the updated Answer

<tbody><td>{{each_item.user_name}}</td><td>{{each_item.user_time}}</td><td>{{each_item.user_description}}</td><td>{{each_item.user_requirement}}</td><td><inputclass="edituser btn btn-info"type="button"value="Edit"data-user-id = "{{each_item.user_id}}"></td></tbody>

change the id to class

       $(".edituser").button().on("click", function () {
           var id = $(this).attr("data-user-id");
           var tempUser;
           for(var user in results){
               if(user.id == id){
                     tempUser = user;
                }
           }
             $("#username").val(tempUser.user_name);
             $("#duration").val(tempUser.user_name);;

            dialog.dialog("open");
        });

you can set the value accordingly from using "user id"

and on submit change the value in the "results" object you using to construct the view

Solution 2:

There are Multiple Way to do it, Next time Please Post the code. Let me assume that you were using the Jquery Model to view

https://jqueryui.com/dialog/#modal-form.

First Way: One Add button one Edit Button(assuming)

1. set id = "Add" for add id = "edit"
2. On Click on Add but show the empty form and use $( "#dialog-form" .dialog( "open" ); to to open the empty form
3. On click on Edit Set the Value in the form (fetch the value from the database if its required) and then $( "#dialog-form" .dialog( "open" );

Secon Way: One Add button Multiple Edit Button(assuming) for each li 1. use class selector class ="edit"

<button class ="edit" data-form-id = "123">Edit</button>

$( ".edit" ).click(function()
{
  var formId  =  $(this).attr("data-form-id ");

  $( "#dialog-form" .dialog( "open" );
 });

For more details post the code we can help you out

Solution 3:

you can add

 <inputtype='hidden' name='actiontype'>

and set value Edit Or Add then in backend you can read this value and choose action for form