افزودن یک دکمه تماس با ما (Contact Us) و یا فرم Feedback یکی از مطلوب ترین نیازمندی های بیزینسی سازمان در زمان استفاده از اینترانت می باشد. جهت ایجاد سریع فرم تماس با ما ، شما می توانید یا از یک وب پارت فرم لیست استفاده کنید و یا از Object Model سمت کاربر برای ایجاد فرم های پویا جهت ارسال سریع بازخورد استفاده کنید.
در این پست ما راجع به روشی جدید و تعاملی در جاییکه یک فرم بازخورد یا Contact Us در یک CallOut شخصی به نمایش در خواهند آمد و بازخورد کاربران با یک Submit CallOut Action به داخل یک لیست شیرپوینت اضافه خواهد شد، صحبت خواهیم کرد.
برای هرچه روشن تر شدن این موضوع به شکل پایین نگاه کنید :
برای شروع کار شما به موارد زیر نیاز دارید :
1- یک لیست Contact Us شخصی در جاییکه Feedback اضافه شده است.
2- یک وب پارت Script Editor در صفحه سایت شیرپوینت در جاییکه اسکریپت CallOut آنجا قرار دارد، در آنجا قرار گرفته است.
برای شروع اسکریپت زیر را کپی و آن را در وب پارت Script Editor صفحه paste کنید.
<script type="text/javascript">
SP.SOD.executeFunc("callout.js", "Callout", function () {
var _link = document.getElementById("ContactusLink");
var listCallout = CalloutManager.createNew({
launchPoint: _link,
beakOrientation: "leftRight",
ID: "CallOut ID",
title: "Contact Us",
content: "<div class=\"ms-soften\" style=\"margin-top:2px; \"><hr/></div>"
+ "<div id='confirmationBLOCK' style=\"margin-top:13px;visibility:hidden;\">Thank you for Contacting Us!</div>"
+ "<div class=\"callout-section\" style=\"margin-top:2px;width:95%;Height:200px; \"><textarea id='CommentsArea' style=\"width:100%;height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;\">Add your Comments here...</textarea></div>",
});
//Creating a Submit Custom Action
var customAction = new CalloutActionOptions();
customAction.text = 'Submit';
customAction.onClickCallback = function(event, action)
{
var _contactUsTextarea = document.getElementById('CommentsArea');
//Adding the new Contact Us Item in the List.
AddIteminList(_contactUsTextarea.value);
_contactUsTextarea.style.visibility='hidden';
};
var _newCustomAction = new CalloutAction(customAction);
listCallout.addAction(_newCustomAction);
});
function AddIteminList(_contactUsText)
{
var context = new SP.ClientContext.get_current();
var web = context.get_web();
var list = web.get_lists().getByTitle('Contact Us');
var listItemCreationInfo = new SP.ListItemCreationInformation();
var newItem = list.addItem(listItemCreationInfo);
newItem.set_item('Title', _contactUsText);
newItem.update();
context.executeQueryAsync(Function.createDelegate(this, this.success), Function.createDelegate(this, this.failed));
}
function success() {
var _confirmationblock = document.getElementById('confirmationBLOCK');
_confirmationblock.style.visibility='visible';
}
function failed(sender, args) { alert('failed to add a List Item:' + args.get_message()); }
</script>
<div id="ContactusLink" style="width:38%;">If you have any question or Concerns, please feel free to <u><span class=\"ms-commandLink\" style=\"text-align: left;font-size: 14px;\">Contact Us</span></u></div>
پس از انجام این کارها آن را ذخیره و صفحه را انتشار دهید. حالا هنگامی که روی لینک Contact Us کلیک می کنید ، CallOut که در پایین می بینید برای شما به نمایش در خواهد آمد.
حال Feedback را در Textarea در Contact Us اضافه کرده و روی دکمه Submit کلیک کنید. تا در لیست Contact Us ذخیره شود.
پس از انجام این کار یک پیام تایید نمایش داده خواهد شد.
در پایان ، اگر آیتم به لیست Contact Us اضافه شده است ، آن را تایید کنید.
پست مرتبط :
رکوردهای نوع ACCOUNTS و CONTACTS
طراحی پرتالهای اینترنت و اینترانت
