JqxDragDrop: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
Created page with "file:jqxDrag.png == Description == The Grid is a powerful jQuery widget that displays tabular data. It offers rich support for interacting with data, including paging, gr..."
 
No edit summary
 
(8 intermediate revisions by 2 users not shown)
Line 2: Line 2:


== Description ==
== Description ==
The Grid is a powerful jQuery widget that displays tabular data. It offers rich support for interacting with data, including paging, grouping, sorting, filtering and editing.
jqxDragDrop is a plugin which will make any control draggable. It can be used in combination with many widgets like jqxTree, jqxGrid, jqxListBox and etc.
 
jqWidgets is a commercial product, which depending on how you use it, requires a license fee. Complete details are on jqWidget's website. The product is well supported.


== Properties and Methods ==
== Properties and Methods ==


See the complete documentation at jqWidget's site:
This control is well documented on the jqWidget's website: http://www.jqwidgets.com/jquery-widgets-documentation/.
http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-getting-started.htm


== Example ==
== Example ==


<pre>
<tabber>
Dim data, source, dataAdapter
JavaScript=
data = generatedata(50)    'generatedata is a function which returns grid data
<syntaxhighlight lang="JavaScript">
source = {localdata: data, datatype: "array"}
var n=0;
dataAdapter = new $.jqx.dataAdapter(source)
TextArea1=Document.getElementById("TextArea1");
             
Label1=Document.getElementById("Label1");
Grid1_settings.source = dataAdapter
 
Grid1_settings.columns = [ _
DragDrop1.onTargetDrop = function() {
    { text: "First Name", dataField: "firstname", width: 100 }, _
  n += 1;
    { text: "Last Name", dataField: "lastname", width: 100 }, _
  TextArea1.value=TextArea1.value + Label1.textContent + " " + n + '\n';
    { text: "Product", dataField: "productname", width: 180 }, _
}
    { text: "Quantity", dataField: "quantity", width: 80, cellsalign: "right" }, _
</syntaxhighlight>
    { text: "Unit Price", dataField: "price", width: 90, cellsalign: "right", cellsformat: "c2" }, _
|-|
    { text: "Total", dataField: "total", cellsalign: "right", minwidth: 100, cellsformat: "c2" } _
BASIC=
  ]
<syntaxhighlight lang="vb.net">
</pre>
Dim n=0
 
Function DragDrop1_onTargetDrop()
  n=n+1
  TextArea1.value=TextArea1.value & Label1.textContent & " " & n & vbCRLF 
End Function
</syntaxhighlight>
</tabber>


== Output ==
== Output ==
See above.
[[Category:Language Reference]]
[[Category:jqWidgets]]
[[Category:Controls]]

Latest revision as of 16:29, 24 July 2019

Description

jqxDragDrop is a plugin which will make any control draggable. It can be used in combination with many widgets like jqxTree, jqxGrid, jqxListBox and etc.

jqWidgets is a commercial product, which depending on how you use it, requires a license fee. Complete details are on jqWidget's website. The product is well supported.

Properties and Methods

This control is well documented on the jqWidget's website: http://www.jqwidgets.com/jquery-widgets-documentation/.

Example

var n=0;
TextArea1=Document.getElementById("TextArea1");
Label1=Document.getElementById("Label1");

DragDrop1.onTargetDrop = function() {
  n += 1;
  TextArea1.value=TextArea1.value + Label1.textContent + " " + n + '\n';
}


Dim n=0

Function DragDrop1_onTargetDrop()
  n=n+1
  TextArea1.value=TextArea1.value & Label1.textContent & " " & n & vbCRLF  
End Function

Output

See above.

Retrieved from "https://wiki.appstudio.dev/index.php?title=JqxDragDrop&oldid=10552"