HTML Cellrenderer Bug - tablecellrenderer

i am trying to set Rich Text in a Table after an Event. The Problem is, that the HTML Tags are only recognized after i clicked on the Header or resize the Table. I did a little Playground Example
After clicking Button the data is loaded with HTML Tags.

You could set the cell renderer before to load the data :
var table = new qx.ui.table.Table(null);
button1.addListener("execute", function(e) {
var tableColumnModel = table.getTableColumnModel();
tableColumnModel.setDataCellRenderer(0, new qx.ui.table.cellrenderer.Html());
tableModel.setData([["<b>test</b>"],["<i>test</i>"]]);
});
Here is the full playground example.

Related

how to toggle using multiple buttons and pass info to the output JQuery

JQUERY CODE:
$('#selector button').click(function() {
$(this).addClass('active').siblings().removeClass('active');
$('#gaga').toggle
})
PUG CODE FOR #gaga element:
p#gaga
| This is `${Value}`
PUG CODE FOR #gaga element:
How can I use three buttons to toggle the #gaga element on when button is active and off when you click outside the specific button and pass a different Value for ${Value} depending on the clicked button. Plus have only one instance of #gaga element running at a time. Meaning if I click the first button then click the second button only the ${Value} will change but the p#gaga element remains only one. I know I have left out the buttons pug code, I don't think it is necessary in solving the problem. But if needed will provide it.
I tried doing it using switch statements but I have failed. Hopefully someone can help.
UPDATE & EDIT as requested by https://stackoverflow.com/users/463319/twisty in the comments.
Here is the code: https://jsfiddle.net/YulePale/mdvnf0qt/4/
After doing some research I have made some progress... but I am still stuck.
I am trying to make it in such a way that when I click anywhere outside the gender buttons the input disappears and when I click another button it changes appropriately. Also instead of an input I want to show and hide the template in the html code.
Also, if you don't mind is .data() use to assign or get a value.
PS: Got this code from this answer : Fixing toggle with two buttons
and modified it a bit, but I am still not able to achieve my desired result.
If you review the API for Menu, they have a nice _closeOnDocumentClick(). You can simply use this in your code in a similar way.
Example: https://jsfiddle.net/Twisty/0x43bf8q/
JavaScript
$(function() {
$("input[type='button']").on('click', toggleOptions)
.first()
.trigger('click');
$(document).on("click", function(e) {
if (emptyOnDocumentClick(e)) {
$('[name=gender]').val("");
}
});
function toggleOptions() {
var $this = $(this),
onClass = 'button-toggle-on';
$this.toggleClass(onClass)
.siblings('input[type=button]')
.removeClass(onClass);
var gender = $this.filter('.' + onClass).data('gender');
$('[name=gender]').val(gender);
}
function emptyOnDocumentClick(event) {
return !$(event.target).closest("input[type='button']").length;
}
});
Hope that helps.

insert xul element into browser so it scrolls with it

I'm trying to insert an xul element into the gBrowser.selectedBrowser element so that this xul element scrolls with the document node.
I used this code to create and add a box:
var win = Services.wm.getMostRecentWindow('navigator:browser');
var panel = win.document.createElementNS('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul','box');
var props = {
style: 'width:300px;height:100px;background-color:red;'
}
for (var p in props) {
panel.setAttribute(p, props[p]);
}
gBrowser.selectedBrowser.appendChild(panel);
problem is that the box is not seen anywhere. it is in the dom inspection though:
As outlined in the comments above the issue is that the <browser> element does not render its contents, similar to an <iframe>.
Your options to have the box scroll with the content are
a) reposition your box via javascript on scroll events
b) build the HTML equivalent of your box and inject it into the content directly. If the page content is untrusted you have to consider security concerns into accounts since it could manipulate the DOM used by your addon.

Multi-Tag Auto Complete Textfield in Apple iOS development with Swift

So far I could accomplish Auto Complete feature on a Textfield UI in Xcode 6 for my iOS app, but my challenge is to make it take multiple tags and then show suggestion for each one. For example:
Enter "Ja" and it shows "Java" in the list, I choose that, type "," and it make it a tag, then I start typing "PH" and it shows "PHP", and I choose that and place another "," and so on. Just like the Jquery Auto-complete for multiple tags. Is there a way to accomplish this in iOS ?
Link to Jquery AutoComplete Plugin
Use WSTagField library by whitesmith
Since you have completed the autocompletion logic. You just need to show the results in a UITableView. Then use WSTagField as shown below to show/hide suggestions table view.
let tagsField = WSTagsField()
// Events
tagsField.onDidAddTag = { field, tag in
//Remove suggestions tableview from the view
print("DidAddTag", tag.text)
}
tagsField.onDidChangeText = { _, text in
//Add suggestions table to the view
}
tagsField.onDidChangeHeightTo = { _, height in
//Update suggestions table frame to prevent tag field covering
}
tagsField.onValidateTag = { tag, tags in
// validate tag here to match your tags list
}

header title missing in jQuery mobile nested listview

The title header in my nested listview in jQuery Mobile is not showing. The docs say the nested header is taken from the parent listitem or . When i use Firebug in Firefox to inspect the header i can see a blue bounding box were the title should be with a div with the class ui-title but the tag is empty.
Has anyone any idea if i can make it appear using an option in mobileinit() or something similar??
I have tried setting static text by testing using this code:
$(':jqmData(url^=results)').on('pagebeforecreate',function (event) {
var title = $(':jqmData(url^=results)').find(':jqmData(role=header) h1').html();
$(this).filter(':jqmData(url*=ui-page)').find(':jqmData(role=header) h3').html('<h3>' + title + '</h3>');
});
Which may be close but its not doing anything either.

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.

Resources