Loading...

Friday, February 17, 2012

SharePoint Dialog Framework:Modal Popups With Dynamic Html

1)Make sure that ' this character dont appear in string in dynamic string as following.
tootipText=tootipText+" <a style=color:"+fontColor+" href=javascript:portal_openModalDialog("+EventUrl+"); >"+iEventCount +"."+this.toString()+"</a>";
$(tdEvent).attr("onclick", "CalendarEventsPopup('"+tootipText+"');");
2)Popup
function CalendarEventsPopup(result)
{

result = result.replace(/[(]/g,"('");
result = result.replace(/[)]/g,"')");

var div= "<div id=htmlDiv>
" + result + "</div>
";
$('body').append(div);
SP.UI.ModalDialog.showModalDialog({
html: document.getElementById('htmlDiv'),
title: "Events",
allowMaximize: false,
showClose: true,
autoSize: true,
dialogReturnValueCallback: Function.createDelegate(
null, portal_modalDialogClosedCallback)

});

function portal_modalDialogClosedCallback(result, value)
{
SP.UI.ModalDialog.RefreshPage(result);
}

For details about the calendar customization ,I have uploaded source code @CodePlex

No comments: