如何将jQuery添加到WebPart(以响应WebPart上的某些事件)

本文关键字：WebPart 事件 响应 jQuery 添加 | 更新日期: 2023-09-27 17:52:36

我开始在我的Sharepoint页面上添加一个UpdatePanel，这样我就可以响应发生的事件(比如复选框的检查和单选按钮的混合等)。然而，从这个问题可以推断出，到目前为止，这一切都是由挫折和其他一切造成的。

所以我现在可能要遍历(没有双关语)jQuery路线，我试图找出/找出如何将jQuery添加到WebPart。

目前，我在c#中根据用户在WebPart的编辑器中选择的内容动态创建控件(如果他们选择显示Section 1，我将为Section 1创建所有控件，等等)。

作为一个例子，我目前在c#中有条件地创建一个RadioButton，如下所示:

var radbtnEmployeeQ = new RadioButton
{
    CssClass = "dplatypus-webform-field-input"
};

现在如果我想给它添加jQuery，我可以给它添加一个ID，像这样:

var radbtnEmployeeQ = new RadioButton
{
    CssClass = "dplatypus-webform-field-input",
    ID = "radbtnEmp"
};

…然后添加这种性质的jQuery(伪代码):

$('radbtnEmp').click {
    // visiblize/invisiblize other controls, assign certain vals to their properties
}

这对我来说似乎是可行的，但是我如何将jQuery添加到WebPart中呢?是否在与*. asx .cs文件相同的目录级别添加.js文件，然后从*. asx .cs文件引用它，还是…?

更新

对于POC测试，我在我的项目中添加了一个名为"directpaydynamic.js"的文件，内容如下:

<script>
    $(document).ready(function () {
        $('input:radio[name=radbtnEmp]:checked').change(function () {
            if ($("input[name='radbtnEmp']:checked").val() == 'Employee?') {
                alert("radbtnEmp checked");
            }
            else {
                alert("radbtnEmp not checked");
            }
        });
    });
</script>

(源自此处的示例)

…并在我的*. asx .cs文件中引用.js文件，如下所示:

SPWeb site = SPContext.Current.Web; 
site.CustomJavaScriptFileUrl = @"C:'Projects'DirectPaymentWebForm'DirectPaymentSectionsWebPart'DPSVisualWebPart'directpaydynamic.js";

(我将.js文件拖到代码中以获得路径)

然而，运行解决方案并捣毁单选按钮不会导致alert()显示，所以我认为我已经选择了一条很少有人走过的路。

更新2

意识到我不需要脚本业务(因为这是一个。js文件，而不是html文件)，我删除了这些，并在jQuery中添加了一个"at any rate"alert():

$(document).ready(function () {
    alert("What's new, pussycat, whoa-oh-oh-oh-OH-oh?");
    $('input:radio[name=radbtnEmp]:checked').change(function () {
        if ($("input[name='radbtnEmp']:checked").val() == 'Employee?') {
            alert("radbtnEmp checked");
        }
        else {
            alert("radbtnEmp not checked");
        }
    });
});

…

如何将jQuery添加到WebPart(以响应WebPart上的某些事件)

在页面加载方法中使用下面的代码

  string url = SPContext.Current.Site.ServerRelativeUrl;
        if (!url.EndsWith("/"))
        {
            url += "/";
        }
HtmlGenericControl styleCss = new HtmlGenericControl("link");
        styleCss.Attributes.Add("rel", "stylesheet");
        styleCss.Attributes.Add("type", "text/css");
        styleCss.Attributes.Add("href", url + "Style Library/css/style.css");
HtmlGenericControl JsLink = new HtmlGenericControl("script");
        JsLink.Attributes.Add("src", url + "Style    Library/js/jquery.min.js");`enter code here`
this.Controls.Add(styleCss);
this.Controls.Add(JsLink);

要做到这一点(或者我应该写，"a"的事情要做)是添加代码，像下面的WebPart的*的结尾。ascx文件:

<script>
$(document).ready(function () {
    alert("The ready function has been reached");
});
$(document).on("change", '[id$=ckbxEmp]', function () {
    alert('Function has been reached');
    if ($(this).is(":checked")) {
        alert("Checked");
    } else {
        alert("Not checked");
    }
}); 
</script>

相关文章：