[UI Mobile] appel Javascript

Je travaille actuellement sous un projet 'MVC 4 ASP.NET Web Application'.

Je possède un tableau de congés(code, date début, date fin). Quand je clique sur une cellule, ça fait un appel Ajax qui me retourne ce qu'il me faut pour l'afficher dans une boite de dialogue.

Dans mon fichier layout.cshtml, j'ai dit que j'ai utilisé JQuery mobile en inscrivant cette ligne-là :

Code:

<script src="@Url.Content("~/Scripts/jquery.mobile-1.3.0.js")"></script>

Le problème est que dès que je rajoute la ligne ci-dessus, mes appels Ajax/Javascript ne sont plus appelés. Pour que mes appels Ajax/Javascript refonctionne, je suis obligé de commenter la ligne.

Avez-vous une solution ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
@{
    ViewBag.Title = "Index";
}
 
<div data-role="page" id="page1">
    <div data-theme="b" data-role="header">
        <a data-role="button" href="@Url.Content("~/holidays")">Back</a>
 
        <h4>Liste congés
 
        </h4>
    </div>
    <div data-role="content">
        @section scripts {
            <script>
                function c() {
                    $('#test').dialog("close");
                    var my_dialog = $('#test').dialog({});//options, etc
                    $('#test').dialog('close');
                    alert("Ma fonction c");
                    //my_dialog.hide();
                }
                $(function () {
 
 
                    $('div[class="ui-body ui-body-d"]').each(function () {
                        alert("hier");
                        $(this).click(function () {
                            var val = $(this).parent();
                            var debug1 = val.nextAll();
                            var debug2 = debug1.filter(".ui-block-d");
                            var debug3 = debug2.first();
                            var debug4 = debug3.attr("value");
                            var arrayID = debug4.split(",");
 
                            var dataResponse = { ContactID: parseInt(arrayID[0]), AbsSeqID: parseInt(arrayID[1]), AbsSplitSeqID: parseInt(arrayID[2]) };
 
                            $.ajax({
                                type: "POST",
                                contentType: "application/json; charset=utf-8",
                                data: JSON.stringify(dataResponse),
                                dataType: "html",
                                url: '@Url.Action("Display", "LeavedList")',
 
                                success: function (mydata) {
                                    alert("hier");
                                    $("#test").html(mydata);
 
                                    $("#test").dialog({
                                        autoOpen: false,
                                        modal: true,
                                        resizable: true
 
                                    });
                                    //$("#test").dialog("open");
                                    //$("#simpleclose").click(function (e) {
                                    //    e.preventDefault();
                                    //    $("#test").empty();
                                    //    location.reload();
                                    //});
                                },
                                error: function (XMLHttpRequest, textStatus, errorThrown) {
                                    alert(errorThrown);
                                }
 
                            });
                        });
                    });
                });
            </script>
        }
        <div id="holsTable" class="ui-grid-b uiresponsive">
 
            <div class="ui-block-a">
                <div data-theme="b" data-role="header" style="margin-left: 0em;">
                    Code
                </div>
 
            </div>
            <div class="ui-block-b">
                <div data-theme="b" data-role="header">
                    Date d&eacute;but
                </div>
            </div>
            <div class="ui-block-c">
                <div data-theme="b" data-role="header">
                    Date fin
                </div>
            </div>
 
            @foreach (MvcApplication1.Models.Holidays hol in ((List<MvcApplication1.Models.Holidays>)ViewBag.Datas))
            {
                <div class="ui-block-a ">
                    <div class="ui-body ui-body-d">
                        @hol.Compteur
                    </div>
                </div>
 
                <div class="ui-block-b ">
                    <div class="ui-body ui-body-d">
                        @hol.Begin.ToString("dd/MM/yy")
                    </div>
                </div>
 
                <div class="ui-block-c ">
                    <div class="ui-body ui-body-d">
                        @hol.End.ToString("dd/MM/yy")
                    </div>
                </div>
 
                <div class="ui-block-d" style="display:none;" value="@hol.ContactID,@hol.AbsSeqID,@hol.AbsSplitSeqID">
                </div>
            }
            @*@Html.Raw(ViewBag.Datas)*@
        </div>
 
        <div id="test"></div>
        <div id="test2"></div>
    </div>
</div>
 
<h2>Index</h2>