locked
Javascript code not working in partial views! RRS feed

  • Question

  • User-79977429 posted

    Hi

    in my Index view, i load a partial view with jquery.get method. it works correctly. my problem is that in my partialView i've used some javascript code which not working!

    here is my simple partial view javascript code :

    @model IEnumerable<Orders>
    
    <button type="button" id="btnNew" class="btn btn-success btn-sm" onclick="newOrderItem()">Create new</button>
    <br />
    <table class="table table-bordered">
        <tr>
            <th>Order ID</th>
            <th>Order Number</th>
            <th>Order Date</th>
            <th>Commands</th>
        </tr>
        @if (Model != null)
        {
            foreach (var item in Model)
            {
                <tr>
                    <td>@item.OrderId</td>
                    <td>@item.OrderNumber</td>
                    <td>@item.OrderDate.Value.ToShamsiDate()</td>
                    <td>                   
                    </td>
                </tr>
            }
        }
    </table>
    
    @section Scripts {
        
        <script src="~/lib/jquery/dist/jquery.min.js"></script>
        <script>
            
            function newOrderItem() {
                alert('Hii');
            }
    
        </script>
    
    }

    As u see in my code, i have a button, in click event call javascript function with simple alert, but at runTime i'm facing this error in console :

    ReferenceError: newOrderItem is not defined

    I'm also include jquery file in my partial view, but i'm facing the same problem!

    Where is my problem & how to solve it?

    Thanks in advance

    Monday, April 20, 2020 11:29 PM

Answers

  • User711641945 posted

    Hi hamed_1983,

    1.You could not use `@section Scripts` in partial view,they do not work.You could just use the `script` in your partial view:

    <button type="button" id="btnNew" class="btn btn-success btn-sm" onclick="newOrderItem()">Create new</button>
    <script>
    
        function newOrderItem() {
            alert('Hii');
        }
    
    </script>

    2.Or if you want to use `@section Scripts`,you need to add js code in your main view instead of partial view.

    Best Regards,

    Rena

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, April 21, 2020 4:34 AM

All replies

  • User-474980206 posted

    if you view source, does the script exist? Does your layout have a script sections? Are you calling the partial via Ajax?

    one of these is probably true.

    Tuesday, April 21, 2020 2:49 AM
  • User711641945 posted

    Hi hamed_1983,

    1.You could not use `@section Scripts` in partial view,they do not work.You could just use the `script` in your partial view:

    <button type="button" id="btnNew" class="btn btn-success btn-sm" onclick="newOrderItem()">Create new</button>
    <script>
    
        function newOrderItem() {
            alert('Hii');
        }
    
    </script>

    2.Or if you want to use `@section Scripts`,you need to add js code in your main view instead of partial view.

    Best Regards,

    Rena

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, April 21, 2020 4:34 AM