Home > DeveloperSection > Forums > How to Processing textual inputs in the client side
Ankita Pandey
Ankita Pandey

Total Post:183

Points:1285
Posted on    January-15-2015 10:00 PM

 ASP.Net C#  JavaScript  ASP.NET MVC  Mvc4  Razor 
Ratings:


 1 Reply(s)
 709  View(s)
Rate this:

Using ASP.NET MVC 5 and Razor view engine, is there a way to get the values of input fields before posting the data to the server, processing them and then sending the processed data instead?

For example:

@using (@Html.BeginForm("ViewPage", "Home", FormMethod.Post)) {

     @Html.TextBox("Field1")

     @Html.Hidden("Field2");

     <input type="submit" id="HiddenButton" value="Submit" style="display:none" />

     <input type="button" id="VisibleButton" value="Submit" />   

}

and now :

<script type="text/javascript">

     document.ready(function() {

        $("#VisibleButton").click(function() {

             var Temp = $("#Field1").val()

             @{

                 // C# Area

                 Processing the Temp, by for example calling an extension method and

                 assigning the new value to the Hidden Field

              }

              $("#HiddenButton").trigger("click")

        })

     })

</script>

I'd like to do this , because I wanna encrypt a text before sending it to the server and I've already made my encryption method in C#.



Mark Devid
Mark Devid

Total Post:102

Points:714
Posted on    January-15-2015 10:23 PM

This is possible but the processing should happen on the client using javascript:

$("#VisibleButton").click(function() {

    var Temp = $("#Field1").val();

 

    // process Temp here using javascript

    Temp = 'some new value';

 

    // set the processed value back to the input field

    $("#Field1").val(Temp);

 

    $("form").submit();

});

If you want the processing to happen on the server for some reasons, you could send it as an AJAX request to a controller action:

$("#VisibleButton").click(function() {

    var temp = $("#Field1").val();

 

    $.ajax({

        url: '@Url.Action("SomeAction")',

        data: { value: temp },

        success: function(result) {

            $("#Field1").val(result);

            $("form").submit();

        }

    });

});

And your controller action:

public ActionResult SomeAction(string value)

{

    // do your processing here

    value = "some new value";

 

    return Json(value);

}

 


Modified On Jun-26-2016 11:24:14 PM

Don't want to miss updates? Please click the below button!

Follow MindStick