HOW TO PROCESSING TEXTUAL INPUTS IN THE CLIENT SIDE

Ankita Pandey

Total Post:183

Points:1285
Posted by  Ankita Pandey
 1031  View(s)
Ratings:
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#.

  1. Mark Devid

    Post:102

    Points:714
    Re: How to Processing textual inputs in the client side

    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

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!