CODEWITHSUNDEEP
javascriptc#htmlasp.net-core
pitten
pitten

Reputation: 97

function is not defined C#

I try to call functions by pressing buttons, but nothing happens and I see it in the console.

Uncaught ReferenceError: AddressInputSet is not defined at HTMLButtonElement.onclick

I'm new to this, please help Asp.NET Core 2.2

<h2 class="text-center">Ваши данные</h2>
<form method="post" asp-controller="Profile" asp-action="UserInfo">
    <div class="form-group">
        <label>Email</label>
        <input class="form-control" type="text" placeholder="@ViewBag.User.Email" readonly />
    </div>
    <div class="form-group">
        <label>Имя</label>
        <input class="form-control" type="text" placeholder="@ViewBag.User.FirstName" readonly />
    </div>
    <div class="form-group">
        <label>Фамилия</label>
        <input class="form-control" type="text" placeholder="@ViewBag.User.LastName" readonly />
    </div>
    <div class="form-group">
        <label>Адресс</label>
        <input class="form-control" id="AddressInput" type="text" placeholder="@ViewBag.User.Address" readonly /><br />
        <button type="button" onclick="AddressInputSet()" class="btn btn-primary" id="buttonSetAddress">Изменить</button>
        <button type="button"onclick="SaveAddress()" class="btn btn-success" id="buttonSaveAddress" hidden>Сохранить</button>
    </div>
</form>
@section Scripts{
    <script type="text/javascript">
    function AddressInputSet() {
        document.getElementById('AddressInput').removeAttribute('readonly');
        document.getElementById('buttonSetAddress').hidden = 'true';
        document.getElementById('buttonSaveAddress').removeAttribute('hidden');
        alert('sdfgdfg');
    };
   function SaveAddress() {
        var data ={
            userId: @ViewBag.User.Id,
            address: document.getElementById('AddressInput').value
        };

        $.ajax({
            type: 'POST',
            url: '/Account/ResetAddress',
            data: data,
            //contentType: "application/x-www-form-urlencoded; charset=utf-8",
            //dataType: JSON,
            success: function () {
                document.getElementById('buttonSaveAddress').hidden = 'true';
            },
            error: function () {
                alert('Error');
            }
        });
    };
    </script>
}

Upvotes: 1

Views: 1332

Answers (3)

Rokive
Rokive

Reputation: 825

just can solve this issue by render javascript in view by section script. code looks like below

@section scripts{
    <script>
        $(document).ready(function () {
            var allItem = 'test'
        console.log(allItem);
    });
    </script>
}

Upvotes: 0

Mamun
Mamun

Reputation: 68913

You can render script in the layout like:

@RenderSection("scripts", false);

OR: Instead of inline event handler try an unobtrusive event handler to attach the events in your JS code:

$('#buttonSetAddress').click(function () {
     document.getElementById('AddressInput').removeAttribute('readonly');
     document.getElementById('buttonSetAddress').hidden = 'true';
     document.getElementById('buttonSaveAddress').removeAttribute('hidden');
     alert('sdfgdfg');
});

Upvotes: 1

gilliduck
gilliduck

Reputation: 2918

Check your @RenderSection("scripts", required: false) in the _Layout view. Make sure it's located inside of the <body> tag and not outside the closing </body> tag.

Upvotes: 2

Related Questions