Shivam
Shivam

Reputation: 101

function is not defined at HTMLButtonElement.onclick

I want to call the function DeleteRow and EditRow on click of Delete Button and Edit Buttton.

<button style="margin-right: 5px;" type='button' onclick='return EditRow(@i)' id='@editrow' class='btn btn-primary btn-sm pull-right'><i class='glyphicon glyphicon-edit'></i>  </button>

<button style="margin-right:5px;" type='button' onclick='return DeleteRow(@i)' id='' class='btn btn-danger btn-sm pull-right'><i class='fa fa-times-circle'></i>  </button>

I have also made functions on my JavaScript file but I am getting this "undefined Error function error".

JavaScript Function here

<script type="text/javascript">
function DeleteRow(id) {
debugger 
//logic here
return false;
}

function EditRow(id) {
//logic here
return false;
}
</script>

I have got similar error before but at that time I only changed the function name in onClick at html and changed the function name at JavaScript but now no matters what I rename the function, I am getting the same error.

Can anyone explain why I am getting this error

Upvotes: 2

Views: 8322

Answers (1)

Jordi Nebot
Jordi Nebot

Reputation: 3401

Your code works if you make sure that your JS is defined before your buttons (or as long as you use some DOM ready event).

Also, make sure @i renders the right value. I don't recognize this pattern...

function DeleteRow(id) {
console.log('Delete ' + id);
return false;
}

function EditRow(id) {
console.log('Edit ' + id)
return false;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>

<button type='button' onclick='return EditRow(1)' id='@editrow' class='btn btn-primary btn-sm'><i class='glyphicon glyphicon-edit'></i>  </button>

<button type='button' onclick='return DeleteRow(1)' id='' class='btn btn-danger btn-sm'><i class='fa fa-times-circle'></i>  </button>

Upvotes: 1

Related Questions