How to clear non Widget contents in the HTML page in smartgwt - html

In my smartgwt application, the html page contains some code consisting of a div and a table.
This is show to the user until the call to server is completed. Once this is done, I want to remove the div and the table from the html page, how can I do that?
PS: I tried RootPanel.get("body").clear() and RootPanel.get("divID").removeFromParent()
and both didn't work
PLEASE HELP!

Try
yourDivOrElementToRemove= DOM.getElementById("idOfTheElement");
DOM.removeChild(RootPanel.getBodyElement(), yourDivOrElementToRemove);
Regards
Alain

Related

How to Print each row in the list table in a separate page. NetSuite Advanced PDF

I am trying to print each row in the picking ticket on a separate page and for now, am using the Row height to move each item to a new page but this is something not professional cuz when I made any change in the template the format is totally changed and this solution will not work so, I am looking for a style to make this solution more dynamic whatever the changes that may happen to the other tables in the PDF.
You can use the css property page-break-after: always for this purpose.
e.g.
<style>
div.ps { page-break-after:always}
</style>
...
<div class="ps">
... ps details
</div>

Is it possible to pass a Django id inside an HTML element, to a jQuery function?

I am displaying a list of blog posts in a for loop, each has a comment form with send button underneath it. I need to let Django know which specific post has been clicked on so have added {{post.id}} to the button element's id. How do I then pass this information to jQuery? Is it possible to do something like this?
<button id="addComBtn{{post.id}}...>Send</button>
$('#addComBtn //post.id here').click(function() {
...
});
Or is there a better way?
Why haven't you tried out?
Yes it is possible. This should be the solution
<button id="addComBtn{{post.id}}...>Send</button>
$('#addComBtn{{ post.id }}').click(function() {
...
});
Because first Django renders the page, with its own engine(meaning, it doesn't check anything else outside of {%%}s and {{}}s), then it sends to the client, and when it renders, it will replace that.

How to make an index

I'd like to make a table of content for this web page I am making (the project is still offline for the time being).
Now I already know most of what I have to do (text boxes, lists, the CSS, etc) however I don't want the links going to new pages but rather it send the user to certain parts of the page like in a wiki.
Any idea on how one would code something like that?
Like this:
Jump to a section
Then in the location to jump to:
<a name="jump"></a>
You can use anchor link (or bookmarks)
The code will be:
<a href="#my-div>Link to 'my div'</a>
<div id="my-div"></div>
That link will scroll the page until the element with the corresponding ID

Changing text content depending on button clicked

I am sort of a beginner at this, but my objective is to have the header of my webpage changing, depending on what button was clicked on another page.
More precisely, I have a webpage with 7 buttons on it coded like this:
<form action="contribution.html">
<input type="submit" style="margin-right: 80px;margin-top: 25px;" value="I contribute">
</form>
All of the buttons lead to the same "contribution.html" page, but I would like the header of that page to be different depending on what button the user clicked. There must be a way to do this without creating 7 different "contribution.html" pages for each button... I assume.
Can anyone help, please?
When you do form submission server receives HTTP post request that contains button clicked. Having that request server side can generate proper content of <title> element. Browser will render that text in <title> as a caption of tab/page.
Thus you will need something like PHP or the like on your server. In this case you can have single contribution.php file (but not static html).
Using javascript is the easiest solution. If you spend a little time learning jQuery, you could use something like this:
// A reference to your "header" element
var header = $('.header');
// When the submit button is clicked
$('[type=submit]').click(function(){
// Update the header with the button's text
header.text( $(this).value() );
});
Though I'd recommend using a more specific selector for the buttons you want this to work for, [type-submit] is too generic but I used it because you did.
Use a server-side language and <a> tags instead of a form.
In PHP it will look something like this:
10$
20$
30$
etc.
Then on contribution.php you can get the request data from $_GET['sum'] and act accordingly.
Depending on your application and if you want to be SEO Friendly you should look into this answer How to dynamically change a web page's title?

Dynamically re-bind html.ValidationMessageFor html helper?

Some background information, I am using ASP.NET with the MVC framework and html helpers.
I currently have a dynamic table where each row has a series of input boxes. Each of these input boxes has a validation message. This works completely fine for the first row. However, when other rows are dynamically added (with the IDs' being changed along with other attributes to match the row number) the validation message no longer works.
Both the row and validation message span are being replicated properly.
In JQuery, this is usually just a problem with the binding, so for each row I would simply re-bind the IDs'. However I am not really to sure how to approach them in ASP.NET.
Any assistance would be appreciated.
Thanks
Alright, I have finally figured this out.
In MVC, in order to handle the validation, it import a JQuery file known as jquery.validate.unobtrusive.js.
However, similar to JQuery, this only occurs at the very beginning when the page is loaded. So, when you add a new dynamic element, you need to remove the bindings and the re-bind them again.
Basically, in your function for adding a new element, put the following lines of code AFTER you have added the new element:
$("#form").removeData("validator");
$("#form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse("#form");
For example:
function addInfoDynamic()
{
document.getElementById("#myDiv").innerHTML += "New Content";
$("#form").removeData("validator");
$("#form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse("#form");
}