JavaScript изучение. Предисловие

Проникся статьей и решил начать изучение. 
Попытаюсь начать серию постов по JavaScript и как его использовать в SharePoint 2010 с ответами на простые вопросы и простыми примерами. 

От себя: Лично мое мнение о JS, JQuery и т.д. было скептическое и я всегда пытался уйти от его использования, но как всегда получается пока не попробуешь не узнаешь все плюсы и минусы. 
После последнего проекта, где на разработку был очень сильно урезано время и бюджет нам пришлось его использовать на свой страх и риск. Не буду рассказывать что именно делали, возможно расскажу позже.


  • Какие JQuery использовать и где их скачать?
Я использовал для решения своих задач вот эти:

<script type="text/javascript" 
src="http://www.microsoft.com/resources/ajax/jquery/jquery-1.7.2.min.js"></script>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/0.7.1a/jquery.SPServices-0.7.1a.min.js">
</script>

  • Какие атрибуты Field использовать в объекте INPUT?
Для INPUT необходим атрибут title 

<input name="ctl00$m$g_e2bcfa9c_6e16_4b44_9833_22e44201a72b$ctl00$ctl04$ctl03$ctl00$ctl00$ctl04$ctl00$ctl00$TextField" type="text" maxlength="255" id="ctl00_m_g_e2bcfa9c_6e16_4b44_9833_22e44201a72b_ctl00_ctl04_ctl03_ctl00_ctl00_ctl04_ctl00_ctl00_TextField" title="Email" class="ms-long" />
  • Как писать функции JQuery?
<script type="text/javascript" src="../../.../jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
});
}
</script>
MSDN Note: $(document).ready(function ()... is referred as the MAIN() function
  • Как сделать get значения из INPUT field?
var variablename = $("input[title='{DisplayName столбца}']").val();
  • Как перевести field в ReadOnly?
$("input[title='{DisplayName столбца}']").attr("readonly","true");
  • Как сделать set значения в field?
$("input[title='{DisplayName столбца}']").val("Значение");

* Для сохранения значений необходимо описать добавление в функции PreSaveAction
  • Как удалить ReadOnly из field?
$("input[title='{DisplayName столбца}']").removeAttr("readonly"); 
  • Как использовать функцию  PreSaveAction?
<script type="text/javascript" src="../../.../jquery-1.7.2.min.js"></script>
<script language = "Javascript">
function PreSaveAction()
{
var variablename = $("input[title='{DisplayName столбца}']").val("Значение");
}</script>

MSDN Note: do not include $(document).ready(function ()...
  • Как менять значения из выпадающих столбцов?
<script type="text/javascript" src="../../.../jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("select[title='{DisplayName столбца}']").change(function () {
//Здесь описываем логику
});
});
</script>

  • Как изменить значение в выпадающем списке?

<script type="text/javascript" src="../..//jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("select[title='{DisplayName столбца}']").change(function () {
//Здесь описываем логику
});
});
</script>
  • Устанавливать ширину столбцов?
$("input[title='DisplayName столбца']").width(100);
  • Как сделать disable текстового столбца?
$("input[title='DisplayName столбца']").attr('disabled','disabled');
  • Как установить RichText по умолчанию?
<script type="text/javascript" src="../../.../jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {

var htmlcontentval = "<table border='1' cellpadding='0' cellspacing='0'><tr><td colspan='3'>Month-Year</td></tr><tr><td>Milestone</td>       <td>Onsite Effort</td><td>Offshore Effort</td></tr><tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr></table>";
$("textarea[title='DisplayName столбца']").val(htmlcontentval);
});
</script>
  • Как конвертировать строку в верхний регистр (ToUpper)?
$("input[title='DisplayName столбца']").val().toUpperCase();

  • Валидация Email адреса, запросто
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
var emailaddressVal = $("input[title='DisplayName столбца']").val();
if(!emailReg.test(emailaddressVal))
{
 alert("{Текст сообщения}");
}
  • Как сделать get значения из столбца подстановки?
$("option:selected", $("select[title='DisplayName столбца']")).text();

Комментарии

Популярные сообщения из этого блога

Полезности под рукой: Приятные SharePoint уведомления для пользователя

Полезности под рукой: Отправка писем при помощи REST API в SharePoint 2013