locked
Problem to access .net variables via JavaScript! RRS feed

 > 

  • Question

  • Question
    Sign in to vote
    0
    Sign in to vote
    User-79977429 posted

    Hi

    In my view, i want to access some of my code behind variables which stored in TempData. To do this, i've using this code for my view & scripts :

    @model DefaultVisitProductHeaders
<div class="row">
    <div class="col-md-6">
        <form id="frmNewPackageHeaderItem" asp-action="Create" method="post">
            <div asp-validation-summary="All" class="text-danger"></div>
            <input type="hidden" id="hdnDefaultVisitProductHeaderRowID" asp-for="DefaultVisitProductHeaderRowID" value="" />
            <div class="form-group">
                <label asp-for="DefaultVisitProductHeaderName" class="control-label"></label>
                <input asp-for="DefaultVisitProductHeaderName" class="form-control" />
                <span asp-validation-for="DefaultVisitProductHeaderName" class="text-danger"></span>
            </div>

            <br />
            <h4>Package Details</h4>
            <hr />
            <div id="divPackageDetails" class="container">
                @Html.RenderAction("GetPackageDetails", "Package", new { id = string.Empty })
            </div>

            <div class="text-right">                
                <button type="button" id="btn" class="btn btn-info" onclick="test()">Test</button>
                @Html.ActionLink("Back", "Index", "Package")
            </div>
        </form>
    </div>
</div>

@section Scripts{   
    <script>
        function test() {
            var lstPackageDetails = '@MyProject.Doctor.Controllers.PackageController.GetPackageDetailsForJS(this.Context)';
        }
    </script>
}

    And here is my csharp method (GetPackageDetailsForJS) :

    public static string GetPackageDetailsForJS(HttpContext context)
        {
            string strResult = string.Empty;

            strResult = HelperMethods.GetJsonStringFromTempData(context, "_lstPackageDetails");

            return strResult;
        }

    My problem is that the test() event handles for button (btn) call my csharp method (GetPackageDetailsForJS) when page being loaded at the first time & can not call it when i click on button. so in my browser devTools, i'm facing an empty variable as follow :

    <script>
        function test() {
            var lstPackageDetails = '[]';
        }
</script>

    Can anybody help me where is the problem & how to solve it?

    Thanks in advance

    Saturday, June 6, 2020 1:46 PM

All replies

  • Question
    Sign in to vote
    0
    Sign in to vote
    User-474980206 posted

    The script is generated with the view, not sure why you don’t use the model or the viewbag. Tempdata is used to pass data to the next request, not controller to view. Typically if you need to call c# on a button click, you use post back or Ajax, but as tempdata matches the last request, I don’t see the point.

    Saturday, June 6, 2020 3:09 PM
  • Question
    Sign in to vote
    0
    Sign in to vote
    User-2054057000 posted

    You have to call a controller method with JavaScript to access .net variables. This type of work is know as AJAX. See this article. 

    Moreover accessing tempdata with JavaScript is a bad approach as tempdata can already be send to view from the controller's action method.

    Example: Controller code

    public IActionResult Index()
{
    TempData["CurrentDateTime"] = DateTime.Now;
    return View();
}

    Index View code:

    @{
    Layout = null;
}
  
<!DOCTYPE html>
  
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>TempDataShow</title>
</head>
<body>
    @TempData["CurrentDateTime"]
</body>
</html>

    Saturday, June 6, 2020 5:34 PM
  • Question
    Sign in to vote
    0
    Sign in to vote
    User-79977429 posted

    Any help?

    Sunday, June 7, 2020 6:15 AM
  • Question
    Sign in to vote
    0
    Sign in to vote
    User475983607 posted

    hamed_1983

    Any help?

    The problem is the design makes no logical sense and you have not clearly explained the problem you are trying to solve. 

    I think you are trying to render dynamic HTML.  This is commonly handled with standard Razor syntax.

    public class ColorVm {
    public int Id { get; set; }
    public string Color { get; set; }
}
    // GET: General
public ActionResult Index()
{
    List<ColorVm> colors = new List<ColorVm>()
    {
        new ColorVm() { Id= 1, Color="Red"},
        new ColorVm() { Id= 2, Color="Blue"},
        new ColorVm() { Id= 3, Color="Yellow"}
    };

    ViewBag.Colors = colors;
    return View();
}

    @{
    ViewData["Title"] = "Index";
}

<h1>Index</h1>


@section scripts 
{
    <script>       
        var colors =  @Html.Raw(System.Text.Json.JsonSerializer.Serialize(ViewBag.Colors));
        console.log(colors);
    </script>
}

    Console results.

    Array(3)
0: {Id: 1, Color: "Red"}
1: {Id: 2, Color: "Blue"}
2: {Id: 3, Color: "Yellow"}

    Sunday, June 7, 2020 11:46 AM