首页 文章

如何激活由ajax datepicker事件生成的选项卡窗口小部件中返回的jquery对话框？

提问于
浏览 次
0

必须有一个简单的解决方案来逃避我 . 但是我对jquery很新，所以我确信这是问题的一部分 .

我有一个datepicker实例，它通过ajax提交日期，并通过tabs小部件返回xhtml . 我正在尝试在返回的选项卡中创建对话框，以解释可能返回的每个不同图像产品的内容 . 根据特定日期发生的成像事件的数量，可以返回任意数量的选项卡 . 并且每个或那些标签将具有不同的图像，但是对图像的“类型”的解释是相同的 . 目前我有大约9种不同的图像'类型'，但这可能随时改变，所以我应该灵活 . 例如，海面温度图像几乎出现在每个标签中 . clorophyll图像仅在白天时间事件中返回 . 在不同的选项卡（不同的图片）中会有许多相同“类型”的图像，但我只需要为每个“类型”提供一个对话框说明 .

我目前在页面上使用jquery对话框，但由于这些是在onLo（）上创建的，因此这些对话框没有问题 . 例如：

//对话提示

$（'#dialog_tip'） . dialog（{
autoOpen：false，
宽度：600，
纽扣： {
"Ok"：function（）{
$（this）.dialog（"close"）;
}，
}
}）;

//对话提示链接
$（'#dialog_tip_link'）.click（function（）{
$（'#dialog_tip'） . dialog（'open'）;
返回虚假;
}）;

当我写两端时，我可以控制serverside ajax请求的输出 . 实际的原始xhtml文档是在服务器端编写的 . 最初运行serverside脚本时会解析 minDate 和 maxDate ，以确保存在有效的数据日期范围 .

这是该事件的当前内容，它工作正常 .

$（'#datepicker'） . datepicker（{
内联：是的，
changeMonth：是的，
changeYear：true，
minDate：“ minDate ”，
maxDate：“ maxDate ”，
defaultDate：“ maxDate ”，
onSelect：function（dateText，inst）{
//警报（dateText）;
日期= dateText;
$就（{
dataType："html"，
类型："POST"，
url：“http：// HOST / cgi-bin / image_data”，
数据：“roi = SITE ＆date =”日期，
成功：函数（数据）{
$（"#pagetabs"） . html（data）;
//找出有多少个标签
last_tab = $（'#tabs li'） . length - 1;
$（'#tabs'） . tabs（{selected：last_tab}）;
screenshotPreview（）; //这样做我可以做
// js适用于较大的
//弹出的缩略图（作品）
// tab_dialogs（）;我希望我能在这里打个电话
//初始化对话框
} // sucess
}）; // AJAX
} // inst
}）;//日期选择器

但是，我无法弄清楚如何有效地创建对话框，并隐藏然后打开 . 我知道我必须在datepicker事件中触发它 . 问题是我不确定将什么放入上面引用的tab_dialogs函数中 . 我不能给某个类型的所有图像提供与破坏DOM相同的id . 并且似乎对话框小部件使用输入的id .

例如“$（'＃dialog_tip_link'） . click（function（）{”

我可以在每种图像类型中为它们提供相同的类 . 我不想创建54个隐藏的对话框，实际上只有9个唯一的实例 . 理想情况下，每种图像类型都有一个类 . 希望我可以循环使用a.product_info（只是一个名称）标签来实现这一点 . 显然，我不能不能从ajax事件改变那个onload所拥有的现有javascript .

任何想法都非常感激，我的一天/周似乎已经消失了？

PS，下一步是将标签放入Accordion小部件，以便首先显示每日图像，然后合成的图像位于较低的手风琴样式部分 .

jquery jquery-ui-dialog jquery-ui-datepicker

1 回答

  • 0

    这有点适用于tab_dialog，除了现在我为每个链接都有几个事件处理程序，所以必须考虑以某种方式使用.one（）？

    function tab_dialogs（）{

    $（"div.product_info a"）.each（function（）{
    var className = $（this）.attr（'class'）; {
    var $ linkclassName = className '_link'; {
    var $ divlinkclassName = "div." className '_link'; {

    $($divlinkclassName).dialog({
 autoOpen: false,
 width: 600,
 buttons: {
  "Ok": function() { 
  $(this).dialog("close"); 
  }, 
 }
});


$(this).click(function(){
 $($divlinkclassName).dialog('open');
 return false;
});

    }）; }

    回复于

相关问题