dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #12697
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 3961: implemented ajax-load in data element category combo
------------------------------------------------------------
revno: 3961
committer: Morten Olav Hansen <mortenoh@xxxxxxxxx>
branch nick: dhis2
timestamp: Mon 2011-06-20 10:41:59 +0300
message:
implemented ajax-load in data element category combo
modified:
dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/addDataElementCategoryComboForm.vm
dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/updateDataElementCategoryComboForm.vm
--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk
Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/addDataElementCategoryComboForm.vm'
--- dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/addDataElementCategoryComboForm.vm 2011-04-14 08:28:01 +0000
+++ dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/addDataElementCategoryComboForm.vm 2011-06-20 07:41:59 +0000
@@ -1,5 +1,19 @@
<script type="text/javascript">
jQuery(document).ready( function(){
+ jQuery("#availableList").dhisAjaxSelect({
+ source: "../dhis-web-commons-ajax-json/getDataElementCategories.action",
+ iterator: 'dataElementCategories',
+ sortSelected: false,
+ connectedTo: 'selectedList',
+ handler: function(item) {
+ var option = jQuery("<option />");
+ option.text( item.name );
+ option.attr( "value", item.id );
+
+ return option;
+ }
+ });
+
validation2( 'addDataElementCategoryComboForm', function( form ){
validateSelectedCategories( form );
}, {
@@ -32,38 +46,44 @@
</table>
<table id="dataElementCategorySelectionArea">
+ <col style="width: 450px"/>
+ <col/>
+ <col style="width: 450px"/>
+ <col/>
+
<thead>
<tr>
<th>$i18n.getString( "available_categories" )</th>
- <th></th>
+ <th></th>
<th>$i18n.getString( "selected_categories" )</th>
</tr>
</thead>
+
<tbody>
-
<tr>
<td>
- <select size="15" id="availableList" name="availableList" multiple="multiple" style="min-width:20em;height:20em" ondblclick="moveSelectedById(this.id, 'selectedList')">
- #foreach ( $availableDataElementCategory in $dataElementCategories )
- <option value="$availableDataElementCategory.id">$encoder.htmlEncode( $availableDataElementCategory.name )</option>
- #end
- </select>
- </td>
- <td valign="top" align="center">
- <input type="button" value=">" onclick="moveSelectedById('availableList', 'selectedList')" title="$i18n.getString( 'move_selected' )"/><br/>
- <input type="button" value="<" onclick="moveSelectedById('selectedList', 'availableList')" title="$i18n.getString( 'remove_selected' )"/><br/><br/>
+ <select id="availableList" name="availableList" multiple="multiple" style="height: 200px; width: 100%;"></select>
+ </td>
+
+ <td style="text-align:center">
+ <input type="button" value=">" title="$i18n.getString( 'move_selected' )" style="width:50px" onclick="dhisAjaxSelect_moveAllSelected( 'availableList' );"/><br/>
+ <input type="button" value="<" title="$i18n.getString( 'remove_selected' )" style="width:50px" onclick="dhisAjaxSelect_moveAllSelected( 'selectedList' );"/><br/>
+ <input type="button" value=">>" title="$i18n.getString('move_all')" style="width:50px" onclick="dhisAjaxSelect_moveAll( 'availableList' );"/><br/>
+ <input type="button" value="<<" title="$i18n.getString('remove_all')" style="width:50px" onclick="dhisAjaxSelect_moveAll( 'selectedList' );"/>
+ </td>
+
+ <td>
+ <select id="selectedList" name="selectedList" multiple="multiple" style="height: 200px; width: 100%; margin-top: 22px;"></select>
+ </td>
+
+ <td>
<a onclick="moveUpSelectedOption('selectedList')" title="$i18n.getString( 'move_up' )"><img src="../images/move_up.png" style="border:0;cursor:pointer" alt="$i18n.getString( 'move_up' )"/></a><br/><br/>
<a onclick="moveDownSelectedOption('selectedList')" title="$i18n.getString( 'move_down' )"><img src="../images/move_down.png" style="border:0;cursor:pointer" alt="$i18n.getString( 'move_down' )"/></a>
- </td>
- <td>
- <select id="selectedList" name="selectedList" multiple="multiple" style="min-width:20em;height:20em" ondblclick="moveSelectedById(this.id, 'availableList')">
- </select>
- </td>
+ </td>
</tr>
+
<tr>
- <td></td>
- <td></td>
- <td>
+ <td colspan="4">
<select id="selectedCategories" name="selectedCategories" style="display:none"></select>
</td>
</tr>
@@ -72,8 +92,8 @@
</table>
<p>
- <input type="submit" name="add" value="$i18n.getString( 'add' )" style="width:10em"/>
- <input type="button" name="cancel" onclick="window.location.href='categoryCombo.action'" value="$i18n.getString( 'cancel' )" style="width:10em"/>
+ <input type="submit" name="add" value="$i18n.getString( 'add' )" style="width:10em" />
+ <input type="button" name="cancel" onclick="window.location.href='categoryCombo.action'" value="$i18n.getString( 'cancel' )" style="width:10em" />
</p>
</form>
=== modified file 'dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/updateDataElementCategoryComboForm.vm'
--- dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/updateDataElementCategoryComboForm.vm 2011-04-15 12:47:28 +0000
+++ dhis-2/dhis-web/dhis-web-maintenance/dhis-web-maintenance-datadictionary/src/main/webapp/dhis-web-maintenance-datadictionary/multidimensional/updateDataElementCategoryComboForm.vm 2011-06-20 07:41:59 +0000
@@ -1,5 +1,19 @@
<script type="text/javascript">
jQuery(document).ready( function(){
+ jQuery("#availableList").dhisAjaxSelect({
+ source: "../dhis-web-commons-ajax-json/getDataElementCategories.action",
+ iterator: 'dataElementCategories',
+ sortSelected: false,
+ connectedTo: 'selectedList',
+ handler: function(item) {
+ var option = jQuery("<option />");
+ option.text( item.name );
+ option.attr( "value", item.id );
+
+ return option;
+ }
+ });
+
validation2( 'editDataElementCategoryComboForm', function( form ) {
validateSelectedCategories( form );
}, {
@@ -37,6 +51,11 @@
</table>
<table id="dataElementCategorySelectionArea">
+ <col style="width: 450px"/>
+ <col/>
+ <col style="width: 450px"/>
+ <col/>
+
<thead>
<tr>
<th>$i18n.getString( "available_categories" )</th>
@@ -46,44 +65,46 @@
</thead>
<tbody>
- <tr>
- <td></td>
- <td></td>
- </tr>
<tr>
<td>
- <select size="15" id="availableList" name="availableList" multiple="multiple" style="min-width:20em;height:20em" ondblclick="moveSelectedById(this.id, 'selectedList')">
- #foreach ( $availableDataElementCategory in $allDataElementCategories )
- <option value="$availableDataElementCategory.id">$encoder.htmlEncode( $availableDataElementCategory.name )</option>
- #end
- </select>
+ <select id="availableList" name="availableList" multiple="multiple" style="height: 200px; width: 100%;"></select>
</td>
</td>
- <td valign="top" align="center">
- <input type="button" value=">" onclick="moveSelectedById('availableList', 'selectedList')" title="$i18n.getString( 'move_selected' )"/><br/>
- <input type="button" value="<" onclick="moveSelectedById('selectedList', 'availableList')" title="$i18n.getString( 'remove_selected' )"/><br/><br/>
+
+ <td style="text-align:center">
+ <input type="button" value=">" title="$i18n.getString( 'move_selected' )" style="width:50px" onclick="dhisAjaxSelect_moveAllSelected( 'availableList' );"/><br/>
+ <input type="button" value="<" title="$i18n.getString( 'remove_selected' )" style="width:50px" onclick="dhisAjaxSelect_moveAllSelected( 'selectedList' );"/><br/>
+ <input type="button" value=">>" title="$i18n.getString('move_all')" style="width:50px" onclick="dhisAjaxSelect_moveAll( 'availableList' );"/><br/>
+ <input type="button" value="<<" title="$i18n.getString('remove_all')" style="width:50px" onclick="dhisAjaxSelect_moveAll( 'selectedList' );"/>
+ </td>
+
+ <td>
+ <select id="selectedList" name="selectedList" multiple="multiple" style="height: 200px; width: 100%; margin-top: 22px;">
+ #foreach ( $dataElementCategory in $dataElementCategories )
+ <option value="$dataElementCategory.id">$encoder.htmlEncode( $dataElementCategory.name )</option>
+ #end
+ </select>
+ </td>
+
+ <td>
<a onclick="moveUpSelectedOption('selectedList')" title="$i18n.getString( 'move_up' )"><img src="../images/move_up.png" style="border:0;cursor:pointer" alt="$i18n.getString( 'move_up' )"/></a><br/><br/>
<a onclick="moveDownSelectedOption('selectedList')" title="$i18n.getString( 'move_down' )"><img src="../images/move_down.png" style="border:0;cursor:pointer" alt="$i18n.getString( 'move_down' )"/></a>
</td>
- <td>
- <select id="selectedList" name="selectedList" multiple="multiple" style="min-width:20em;height:20em" ondblclick="moveSelectedById(this.id, 'availableList')">
- #foreach ( $dataElementCategory in $dataElementCategories )
- <option value="$dataElementCategory.id">$encoder.htmlEncode( $dataElementCategory.name )</option>
- #end
- </select>
- </td>
+
</tr>
+
<tr>
- <td></td>
- <td></td>
- <td>
+ <td colspan="4">
<select id="selectedCategories" name="selectedCategories" style="display:none"></select>
</td>
</tr>
+
</tbody>
</table>
-<p><input type="submit" name="update" value="$i18n.getString( 'update' )" style="width:10em"/>
-<input type="button" name="cancel" onclick="window.location.href='categoryCombo.action'" value="$i18n.getString( 'cancel' )" style="width:10em"/></p>
+<p>
+ <input type="submit" name="update" value="$i18n.getString( 'update' )" style="width:10em" />
+ <input type="button" name="cancel" onclick="window.location.href='categoryCombo.action'" value="$i18n.getString( 'cancel' )" style="width:10em" />
+</p>
</form>