jquery - Refresh a table in asp.net -

i have form on page this

@using (html.beginform("addrecipeline", "kitchen", formmethod.get, new { id = "addrecipeline" }))         {             <div class="medium-4 columns">                 @html.dropdownlist("ingredients", (ienumerable<selectlistitem>)viewbag.ingredients, "--select ingredients--")             </div>             <div class="medium-4 columns">                 @html.textbox("quantity", null, new { placeholder = "quantity", @type = "number", min = "1" })                 @html.textbox("recipeid", null, new { @type = "hidden", @value = @viewbag.recipe.id })             </div>             <div class="medium-4 columns">                 <button class="button tiny">add</button>             </div>         } 

i use jquery submit form

$('#addrecipeline').submit(function (event) {     event.preventdefault();     var ingredientid = $('#ingredients').val();     var quantity = parseint($('#quantity').val());     var rid = $('#recipeid').val();      if (ingredientid != '' && quantity != '') {         instafood.recipeline.add(ingredientid, quantity, rid, function (result) {             console.log(result);             $('#addrecipeline')[0].reset();         });     } }); 

in same view have table shows data added through form.

<table>     <thead>         <tr>             <th>ingredient name (kcals)</th>             <th>quantity</th>         </tr>     </thead>     @foreach (var recipeline in recipeline.getbyrecipe(@viewbag.recipe.id))     {         <tr>             <td>@recipeline.getingredient().name (@recipeline.getingredient().kilocalories)</td>             <td> @recipeline.quantity</td>         </tr>     } </table> 

what want table record gets refreshed whenever add data through form. ajax thing refresh table when ever user submits form.

use callback in jquery submit. append table doing below thing

console.log(result);