How made JavaScript cohesion work? Lets me explain better: I have my index page that call models forms with jquery dialogs, but I don't want put all javascript in index page, instead I want the jquery separate for page.
Model form
This work
INDEX PAGE
@section Scripts
{
<link href="@Url.Content("~/Content/themes/base/minified/jquery-ui.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready
(
function () //<--I dont want this function here
{
Alert1();
}
$(".Create").live
(
"click", function (e) {
var url = $(this).attr('href');
$("#dialog-view").dialog
(
{
title: 'Create new User',
autoOpen: false,
resizable: false,
height: 600,
width: 600,
show: { effect: 'drop', direction: "up" },
modal: true,
draggable: true,
open: function (event, ui) {
$(this).load(url);
},
buttons:
{
"Cancel": function ()
{
$(this).dialog("close");
},
"Save": function ()
{
$(this).dialog('close');
}
},
close: function (event, ui) {
$(this).dialog('close');
}
}
);
);
function Alert1() //<--I dont want this function here
{
alert("Star!");
}
</script>
}
How should work
INDEX PAGE
@section Scripts
{
<link href="@Url.Content("~/Content/themes/base/minified/jquery-ui.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready
(
$(".Create").live
(
"click", function (e) {
var url = $(this).attr('href');
$("#dialog-view").dialog//<--Only opening dialogs
(
{ ....
);
</script>
}
And model forms with you specifics javascripts
@section Scripts
{
<link href="@Url.Content("~/Content/themes/base/minified/jquery-ui.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready
(
function ()
{
Alert1();
}
);
function Alert1()
{
alert("Star!");
}
</script>
}
Actually, when I made it the model javascript don't work.
I'm using Entity-framework, thanks for everything.
SOLUTION
<script type="text/javascript">
$(document).ready
(
function ()
{
Alert1();
}
);
function Alert1()
{
alert("Star!");
}
</script>