JQuery и ASP.Net Ajax конфликтуют? - PullRequest
Новая
       26

JQuery и ASP.Net Ajax конфликтуют?

2 голосов
/ 02 марта 2012

Мне интересно, существуют ли какие-либо распространенные или известные конфликты / обходные пути для работы с jquery и ASP.Net ajax.В частности, кажется, что есть некоторые проблемы при использовании метода JQuery wrapinner и последующем вызове метода .Net $find.

Это общая идея разметки, которую я использую.Это довольно сложный макет, поэтому я по большей части его урезал.Извините, это так плотно.Ошибка происходит в функции resizePage.

ВНЕШНЯЯ СТРАНИЦА 

<html>
<head></head>
<body>
    <div>
    <telerik:radsplitter id="rsMain" runat="server" orientation="Vertical" height="100%"
        width="100%" bordersize="0" panesbordersize="0" resizewithbrowserwindow="true">
        <telerik:radpane id="rpCentral" runat="server" scrolling="None">
        <div id="wrapper" style="padding: 0 0 0 0; margin: 0 0 0 0;">
            <iframe name="left_frame" src="test.aspx" runat="server" id="left_frame" width="100%"
            frameborder="0" marginheight="0" marginwidth="0" height="100%"></iframe>
        </div>
        </telerik:radpane>
        <telerik:radsplitbar id="rsbRHS" runat="server" collapsemode="Backward">
        </telerik:radsplitbar>
        <telerik:radpane id="rpRHS" runat="server" width="30%" minwidth="50" minheight="50">
        <iframe name="right_frame" src="field_description.aspx" width="100%" frameborder="0"
            marginheight="0" marginwidth="0" height="100%" scrolling="auto"></iframe>
        </telerik:radpane>
    </telerik:radsplitter>
    <script type="text/javascript">

        function ResizePage() {
            var width = widthPCT * jQuery(window).width();
            var panel = $find('<%= rpRHS.ClientID %>');

            var collapsed = panel._isCollapsed();

            $find('<%= rpRHS.ClientID %>').Expand();
            $find('<%= rpRHS.ClientID %>').set_width(width);

            if (collapsed)
                $find('<%= rpRHS.ClientID %>').Collapse();
        };

        function AddScrolling() {
            var body = GetFrameBody();


            if (body.length == 0) {
                setTimeout("AddScrolling()", 500);
                return;
            }

            jQuery(body).wrapInner("<div id='reportwrapper' style='overflow: auto; position: relative;'></div>");
            jQuery(body).css("background-color", "red");

            ResizePage();
        }

        $.noConflict();
        jQuery(document).ready(function () {
            AddScrolling();
        });

        jQuery(window).resize(function () {
            setTimeout(ResizePage, 100);
        });    
    </script>
    </div>
</body>
</html>

ВНУТРЕННЯЯ СТРАНИЦА 

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:radscriptmanager id="scriptManager" runat="server" />
    <div>
        <div id="inner" style="height: 2000px; width: 2000px">
          Some Text
        </div>
    </div>
    </form>
</body>
</html>

Ответы [ 2 ]

0 голосов
/ 07 мая 2012

Используйте jquery splitter вместо rad

http://methvin.com/splitter/

0 голосов
/ 02 марта 2012

Вы можете перевести jQuery в режим noConflict следующим образом: 

<script type="text/javascript" src="other_lib.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code that uses jQuery's $ can follow here.
  });
  // Code that uses other library's $ can follow here.
</script>

Мне пришлось сделать то же самое на странице, на которой я использовал Ajax.

ОБНОВЛЕНИЕ: Я заметил, что вы используете элементы управления telerik, поэтому я провел некоторый поиск и придумал следующее:

ASP.NET AJAX $ метод find завершается ошибкой при использовании в jQuery-методе $ (document) .ready () .

Этот вопрос / ответ Stackoverflow может помочь.

...