Print pages from a .gsp page - grails

I have a .gsp file where I have 2 forms containing a button for print. I need to print out a page using the information using 2nd form content when print button is pressed.
How can I do this?

On click of the print button, you can populate a hidden div with the form information. Then using a CSS print stylesheet (using media queries), you can format that div to print the information as you see fit.
If you are looking to popup the print dialog on click, then use window.print() in your javascript code.

Related

how to show html content for md-selected-item in md-autocomplete

We are trying to use md-autocomplete in our application. Things are working as expected, but we have a specific requirement for displaying the selected item.
Instead of just displaying a text, we need to display a HTML content with some avatar and formatted content.
md-item-text only displays any text provided, I tried the html content, but it does not work.
md-item-template works for the items displayed in the list, but the same styling is not applied to selected item.
Is there anyway to show the html content in Selected Item ? Any suggestions ?

how to populate a KendUI Window

I am new to Kendo UI. I would like to be able to display a popup with the results from my controller.
My example is very simple. I have this data on my page.
Some text [Create]
When I click on [Create], a call in made to my controller. The controller will create a PDF file. Next, I would like to be able to display the pdf in a KendoUI Window.
I am getting hung up on how to pass info back to page so the KendoUi Window is aware of the PDF file name to display.
Thanks in advance for your tips.
Steve
MVC 4
KendoUI 2012.2.270
There are two basic approaches:
You create the window when page is loaded and have a function for changing the content and make it visible.
You create the window each time.
Assuming that you for 1. Then you have an HTML that is something like this
<div id="popup_window">
</div>
Create PDF
Then you define the window and the click bind for triggering the open as:
$("#popup_window").kendoWindow({
title :"PDF document",
visible :false
});
$("#show").click(function () {
$("#popup_window").html("<object id='pdf' data='doc.pdf' type='application/pdf'/>");
$("#popup_window").data("kendoWindow").open();
});
Where I create a kendoWindow but set it's visibility to not visible.
Then I bind a function to the click on the Create PDF message that sets the content to an HTML object where data attribute is the pdf document and then open by invoking kendoWindow open method.

"Out of stack space " while using jquery dialog in a jqgrid

I'm having a jqgrid and on the loadComplete of the grid i am calling a function that creates a new div with some custom classes and appends that div to one of the columns where i am displaying the custom image button created in the div.
Now, on the click of the image button i am displaying a modal dialog form. On my modal dialog form i am getting some value by making a ajax call for the selected record .Also there are two buttons ( save and cancel) on the dialog. When .dialog("close") method is called after save or on close, i am getting a error "SCRIPT28: Out of stack space " and Strangely the save also works fine.
Can anybody assist on that.
Thanks in advance.

How to show TinyMCE editor in jquery modal window on click

I have made a blog application where I have this form for writing the blog. It has a title field, an instance of of tinymce editor for the blog body, a text field for adding tags and the submit button.
What I want to do is to by default show the whole form to the user when the page loads. The user can fill in the title. Now when the user comes on the text-editor, there will be a button on clicking which only the text editor will open in the modal window and the user can type in that.
Once the user clicks on the cross, then the text is copied to the underlying text editor. I am not that good at javascript and I have looked a few blogs, but that didn't help. Any directions will be really appreciated. I am adding a snapshot of how the blog page looks like.
You need to start off by initializing your TinyMCE editor with something like this (add in any options you want):
$(function() {
tinyMCE.init({
mode: "none",
theme: "simple",
});
//whatever code
});
You can set up any mode you like but I'm going to go with dynamic creation (mode: none) because it gives you more control. Initialize your modal in "whatever code" then create your editor inside the modal with the code below:
tinyMCE.execCommand('mceAddControl', false, 'id_of_textarea');
To get/set the content of your editor you would do this:
tinyMCE.activeEditor.getContent();
tinyMCE.activeEditor.setContent('data in here');
You'll need to close your tinyMCE editor before you close your modal or it will fail to load next time the modal opens. To close it you need to execute the following code:
tinyMCE.execCommand('mceRemoveControl', false, 'id_of_textarea');

TinyMCE Printing HTML

TinyMCE...
when I save form data, the text that was entered through the editor is being displayed with all of the tags in my index and detail view. Any idea how I can display the data as normal without html mark up?
How are you outputting the text ?
I'd guess you should be using this:
#Html.Raw(Model.MceText)

Resources