Picklist- Move buttons not working

UI Components for JSF

ebianchini
Posts: 22
Joined: 06 May 2011, 15:45
Location: São Paulo/Brazil

25 Nov 2014, 20:50

chr0x wrote:Hi! I'm facing the same problem here with these buttons. There's something I can do to fix the Move UP and Move DOWN buttons for the picklist?
Hi ch0x. You can use this javascript snippet to fix the bug, if you don't want to update the PrimeFaces.

Code: Select all

fixPickList = function() {
	if (typeof PrimeFaces.widget.PickList != 'undefined') {
		PrimeFaces.widget.PickList.prototype.bindButtonEvents = function() {
			var a = this;
			PrimeFaces.skinButton(this.jq.find(".ui-button"));
			$(this.jqId + " .ui-picklist-button-add").click(function() {
				a.add();
			});
			$(this.jqId + " .ui-picklist-button-add-all").click(function() {
				a.addAll();
			});
			$(this.jqId + " .ui-picklist-button-remove").click(function() {
				a.remove();
			});
			$(this.jqId + " .ui-picklist-button-remove-all").click(function() {
				a.removeAll();
			});
			if (this.cfg.showSourceControls) {
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-up")
						.click(function() {
							a.moveUp(a.sourceList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-top")
						.click(function() {
							a.moveTop(a.sourceList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-down")
						.click(function() {
							a.moveDown(a.sourceList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-bottom")
						.click(function() {
							a.moveBottom(a.sourceList);
						});
			}
			if (this.cfg.showTargetControls) {
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-up")
						.click(function() {
							a.moveUp(a.targetList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-top")
						.click(function() {
							a.moveTop(a.targetList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-down")
						.click(function() {
							a.moveDown(a.targetList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-bottom")
						.click(function() {
							a.moveBottom(a.targetList);
						});
			}
		};
	}
};
You have to call fixPickList on document ready.
Glassfish 3.1.2.2 build 5
JSF Mojarra 2.1.26
PrimeFaces 5.1
Google Chrome 38.0.2125.104

Everton Bianchini

chr0x
Posts: 4
Joined: 20 Nov 2014, 03:56
Location: Vitória, Brazil

25 Nov 2014, 23:22

ebianchini wrote:
chr0x wrote:Hi! I'm facing the same problem here with these buttons. There's something I can do to fix the Move UP and Move DOWN buttons for the picklist?
Hi ch0x. You can use this javascript snippet to fix the bug, if you don't want to update the PrimeFaces.

Code: Select all

fixPickList = function() {
	if (typeof PrimeFaces.widget.PickList != 'undefined') {
		PrimeFaces.widget.PickList.prototype.bindButtonEvents = function() {
			var a = this;
			PrimeFaces.skinButton(this.jq.find(".ui-button"));
			$(this.jqId + " .ui-picklist-button-add").click(function() {
				a.add();
			});
			$(this.jqId + " .ui-picklist-button-add-all").click(function() {
				a.addAll();
			});
			$(this.jqId + " .ui-picklist-button-remove").click(function() {
				a.remove();
			});
			$(this.jqId + " .ui-picklist-button-remove-all").click(function() {
				a.removeAll();
			});
			if (this.cfg.showSourceControls) {
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-up")
						.click(function() {
							a.moveUp(a.sourceList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-top")
						.click(function() {
							a.moveTop(a.sourceList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-down")
						.click(function() {
							a.moveDown(a.sourceList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-source-controls .ui-picklist-button-move-bottom")
						.click(function() {
							a.moveBottom(a.sourceList);
						});
			}
			if (this.cfg.showTargetControls) {
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-up")
						.click(function() {
							a.moveUp(a.targetList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-top")
						.click(function() {
							a.moveTop(a.targetList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-down")
						.click(function() {
							a.moveDown(a.targetList);
						});
				$(
						this.jqId
								+ " div.ui-picklist-target-controls .ui-picklist-button-move-bottom")
						.click(function() {
							a.moveBottom(a.targetList);
						});
			}
		};
	}
};
You have to call fixPickList on document ready.
Hi ebianchini! This solution didn't work for me :/

I think I made a mistake on the call method. Can you describe how you have called your function? I'm trying to call it directly via xhtml.

PS: If you could contact me via email I will be very grateful (I saw in your profile that you're from Brazil, me too). You can find my e-mail at my profile page.
PF 5.1 / JSF 2.1

ebianchini
Posts: 22
Joined: 06 May 2011, 15:45
Location: São Paulo/Brazil

26 Nov 2014, 13:12

Code: Select all

customiseAutoComplete = function() {
	if (typeof PrimeFaces.widget.AutoComplete != 'undefined') {
		PrimeFaces.widget.AutoComplete.prototype.search = function(c) {
			if (c === undefined || c === null) {
				return
			}
			if (this.cfg.cache && this.cache[c]) {
				this.panel.html(this.cache[c]);
				this.showSuggestions(c);
				return
			}
			if (!this.active) {
				return
			}
			var d = this;
			if (this.cfg.itemtip) {
				this.itemtip.hide()
			}
			var b = {
				source : this.id,
				process : this.id,
				update : this.id,
				formId : this.cfg.formId,
				onstart : function() {
					$(PrimeFaces.escapeClientId(d.id)).toggleClass('ui-autocomplete-query');
				},
				oncomplete : function(xhr, args, status) {
					$(PrimeFaces.escapeClientId(d.id)).toggleClass('ui-autocomplete-query');
				},
				onsuccess : function(g, e, f) {
					PrimeFaces.ajax.Response.handle(g, e, f, {
						widget : d,
						handle : function(h) {
							this.panel.html(h);
							if (this.cfg.cache) {
								this.cache[c] = h
							}
							this.showSuggestions(c)
						}
					});
					return true
				}
			};
			b.params = [ {
				name : this.id + "_query",
				value : c
			} ];
			if (this.hasBehavior("query")) {
				var a = this.cfg.behaviors.query;
				a.call(this, b)
			} else {
				PrimeFaces.ajax.AjaxRequest(b)
			}
		};
	}
};

$(document).ready(function() {
	fixPickList();
});
Put this in a javascript file, add this file to your page and the problem must be gone.

PS: I do prefer to talk here, so the solution will be available to all that can be searching for it.
Glassfish 3.1.2.2 build 5
JSF Mojarra 2.1.26
PrimeFaces 5.1
Google Chrome 38.0.2125.104

Everton Bianchini

chr0x
Posts: 4
Joined: 20 Nov 2014, 03:56
Location: Vitória, Brazil

27 Nov 2014, 18:36

ebianchini wrote:

Code: Select all

customiseAutoComplete = function() {
	if (typeof PrimeFaces.widget.AutoComplete != 'undefined') {
		PrimeFaces.widget.AutoComplete.prototype.search = function(c) {
			if (c === undefined || c === null) {
				return
			}
			if (this.cfg.cache && this.cache[c]) {
				this.panel.html(this.cache[c]);
				this.showSuggestions(c);
				return
			}
			if (!this.active) {
				return
			}
			var d = this;
			if (this.cfg.itemtip) {
				this.itemtip.hide()
			}
			var b = {
				source : this.id,
				process : this.id,
				update : this.id,
				formId : this.cfg.formId,
				onstart : function() {
					$(PrimeFaces.escapeClientId(d.id)).toggleClass('ui-autocomplete-query');
				},
				oncomplete : function(xhr, args, status) {
					$(PrimeFaces.escapeClientId(d.id)).toggleClass('ui-autocomplete-query');
				},
				onsuccess : function(g, e, f) {
					PrimeFaces.ajax.Response.handle(g, e, f, {
						widget : d,
						handle : function(h) {
							this.panel.html(h);
							if (this.cfg.cache) {
								this.cache[c] = h
							}
							this.showSuggestions(c)
						}
					});
					return true
				}
			};
			b.params = [ {
				name : this.id + "_query",
				value : c
			} ];
			if (this.hasBehavior("query")) {
				var a = this.cfg.behaviors.query;
				a.call(this, b)
			} else {
				PrimeFaces.ajax.AjaxRequest(b)
			}
		};
	}
};

$(document).ready(function() {
	fixPickList();
});
Put this in a javascript file, add this file to your page and the problem must be gone.

PS: I do prefer to talk here, so the solution will be available to all that can be searching for it.
Hi ebianchini, your workaround has solved my problem. Thanks! o/
PF 5.1 / JSF 2.1

tayfun
Posts: 16
Joined: 13 Aug 2014, 10:56

12 Feb 2015, 11:14

same problem here.
IDEA 14.0.2
Java 1.6.0_45
Weblogic 12.1.3
Primefaces 5.1

kukeltje
Expert Member
Posts: 9605
Joined: 17 Jun 2010, 13:34
Location: Netherlands

12 Feb 2015, 11:32

A workaround is mentioned and a new version where it is fixed is available as well. So, out of curiosity, may I ask what the 'added value' and reason of your comment is?

Cheers

tayfun
Posts: 16
Joined: 13 Aug 2014, 10:56

26 Feb 2015, 10:43

ebianchini wrote:

Code: Select all

customiseAutoComplete = function() {
	if (typeof PrimeFaces.widget.AutoComplete != 'undefined') {
		PrimeFaces.widget.AutoComplete.prototype.search = function(c) {
			if (c === undefined || c === null) {
				return
			}
			[b]if (this.cfg.cache && this.cache[c]) {[/b]
				this.panel.html(this.cache[c]);
				this.showSuggestions(c);
				return
			}
			if (!this.active) {
				return
			}
			var d = this;
			if (this.cfg.itemtip) {
				this.itemtip.hide()
			}
			var b = {
				source : this.id,
				process : this.id,
				update : this.id,
				formId : this.cfg.formId,
				onstart : function() {
					$(PrimeFaces.escapeClientId(d.id)).toggleClass('ui-autocomplete-query');
				},
				oncomplete : function(xhr, args, status) {
					$(PrimeFaces.escapeClientId(d.id)).toggleClass('ui-autocomplete-query');
				},
				onsuccess : function(g, e, f) {
					PrimeFaces.ajax.Response.handle(g, e, f, {
						widget : d,
						handle : function(h) {
							this.panel.html(h);
							if (this.cfg.cache) {
								this.cache[c] = h
							}
							this.showSuggestions(c)
						}
					});
					return true
				}
			};
			b.params = [ {
				name : this.id + "_query",
				value : c
			} ];
			if (this.hasBehavior("query")) {
				var a = this.cfg.behaviors.query;
				a.call(this, b)
			} else {
				PrimeFaces.ajax.AjaxRequest(b)
			}
		};
	}
};

$(document).ready(function() {
	fixPickList();
});
Put this in a javascript file, add this file to your page and the problem must be gone.

PS: I do prefer to talk here, so the solution will be available to all that can be searching for it.
it didnt solve my problem. i think still something missing in this line
<script type="text/javascript">
customiseAutoComplete = function() {
...
};

$(document).ready(function() {
fixPickList();
});
</script>
error in this line
if (this.cfg.cache && this.cache[c]) {
IDEA 14.0.2
Java 1.6.0_45
Weblogic 12.1.3
Primefaces 5.1

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 8 guests