Search Results

Search found 468 results on 19 pages for 'knockout sortable'.

Page 11/19 | < Previous Page | 7 8 9 10 11 12 13 14 15 16 17 18  | Next Page >

  • YUI DataTable - Howto have just one paginator?

    - by Rollo Tomazzi
    Hello, I'm using the YUI DataTable in a Grails 1.1 project using the Grails UI plugin 1.0.2 (YUI being 2.6.1). By default, the DataTable displays 2 paginators: one above and another one below the table. Looking up the YUI API documentation, I could see that I can pass an array of YUI containers as a config parameter but - what are the names of these containers? I've tried loooking at the HTML of the page using Firebug. The ID of the divs containing the paginators are: yui-dt0-paginator0 (above) and yui-dt0-paginator1 (below). If I use them to configure the containers for the navigator, then the navigator is just not displayed at all. Here's the relevant extract of the GSP page containing the Datatable element. <div class="body"> <h1>This is the List of Control Accounts</h1> <g:if test="${flash.message}"> <div class="message">${flash.message}</div> </g:if> <div class="yui-skin-sam"> <gui:dataTable controller="controlAccount" action="enhancedListDataTableJSON" columnDefs="[ [key:'id', label:'ID'], [key:'col1', label:'Col 1', sortable: true, resizeable: true], [key:'col2', label:'Col 2', sortable: true, resizeable: true] ]" sortedBy="col1" rowsPerPage="20" paginatorConfig="[ template:'{PreviousPageLink} {PageLinks} {NextPageLink} {CurrentPageReport}', pageReportTemplate:'{totalRecords} total accounts', alwaysVisible:true, containers:'yui-dt0-paginator1' ]" rowExpansion="true" /> </div> </div> Any help? Thanks! Rollo

    Read the article

  • jQuery Datatables throws error when dynamically created row headers

    - by JM4
    I am using the Datatables jquery plugin for one of my projects. For one in particular, the number of columns can vary based on how many children a consumer has (yes I realize normalization and proper technique would insert on another row but it is a client requirement). Datatables must be set up as such: <table> <thead> <tr> <th></th> </tr> </thead> <tbody> <tr> <td></td> </tr> </tbody> </table> my script starts out as: <table cellpadding="0" cellspacing="0" border="0" class="display" id="sortable"> <thead> <tr> <th>parent name</th> <th>parent phone</th> <?php try { $db->beginTransaction(); $stmt = $db->prepare("SELECT max(num_deps) FROM (SELECT count(a.id) as num_deps FROM children a INNER JOIN parents b USING(id) WHERE a.id !=0 GROUP BY a.id) x"); $stmt->execute(); $rows = $stmt->fetchAll(); for($i=1; $i<=$rows[0][0]; $i++) { echo " <th>Child Name ".$i."</th> <th>Date of Birth ".$i."</th> "; } $db->commit(); } catch (PDOException $e) { echo "<p align='center'>There was a system error. Please contact administration.<br>".$e->getMessage()."</p><br />"; } ?> </tr> </thead> In this manner, the final column headers can be 1 or 50 spots long. However, with this dynamic code in place, datatables throws the following error: ""DataTables warning (table id = 'datatable'): Cannot reinitialise DataTable. To retrieve the DataTables object for this table, please pass either no arguments to the dataTable() function, or set bRetrive to true. Alternativly, to destroy old table and create a new one...ETC."' Yes I have set "bRetrieve" : true in the javascript above and that does not do the trick. If I remove the code above, the file "works" fine but it leaves off the necessary columns for my table. Any ideas? Displaying JS <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script> <script type="text/javascript" src="../media/js/jquery.dataTables.min.js"></script> <script type="text/javascript" src="../media/js/TableTools/TableTools.js"></script> <script type="text/javascript" src="../media/ZeroClipboard/ZeroClipboard.js"></script> <script type="text/javascript"> $(document).ready(function() { TableToolsInit.sSwfPath = "../media/swf/ZeroClipboard.swf"; oTable = $('#sortable').dataTable({ "bRetrieve": true, "bProcessing": true, "sScrollX": "100%", "sScrollXInner": "110%", "bScrollCollapse": true, "bJQueryUI": true, "sPaginationType": "full_numbers", "sDom": 'T<"clear"><"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lfr>t<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>' }); }); </script> </head> TOP piece of HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Home</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" type="text/css" href="style.css" /> <link rel="stylesheet" type="text/css" href="default.css" /> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> <style type="text/css" title="currentStyle"> @import "TableTools.css"; @import "demo_table_jui.css"; @import "jquery-ui-1.8.4.custom.css"; </style> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script> <script type="text/javascript" src="js/jquery.dataTables.min.js"></script> <script type="text/javascript" src="js/TableTools/TableTools.js"></script> <script type="text/javascript" src="ZeroClipboard/ZeroClipboard.js"></script> <script type="text/javascript"> $(document).ready(function() { TableToolsInit.sSwfPath = "ZeroClipboard.swf"; oTable = $('#sortable').dataTable({ "bRetrieve": true, "bProcessing": true, "sScrollX": "100%", "sScrollXInner": "110%", "bScrollCollapse": true, "bJQueryUI": true, "sPaginationType": "full_numbers", "sDom": 'T<"clear"><"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lfr>t<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>' }); }); </script> </head> <body bgcolor="#e0e0e0"> <div class="main"> <div class="body"> <div class="body_resize"> <div class="liquid-round"> <div class="top"><span><h2>Details</h2></span></div> <div class="center-content"> <div style="overflow-x:hidden; min-height:400px; max-height:600px; overflow-y:auto;"> <div class="demo_jui"><br /> <table cellpadding="0" cellspacing="0" border="0" class="display" width="100%" id="sortable"> <thead> <tr> <th>First Name</th> <th>MI</th> <th>Last Name</th> <th>Street Address</th> <th>City</th> <th>State</th> <th>Zip</th> <th>DOB</th> <th>Gender</th> <th>Spouse Name</th> <th>Spouse Date of Birth</th> <!-- this part is generated with the php, when removed, datatables works just fine with the rest of the page --> <th>Dependent Child Name 1</th> <th>Dependent Date of Birth 1</th> <th>Dependent Child Name 2</th> <th>Dependent Date of Birth 2</th> <th>Dependent Child Name 3</th> <th>Dependent Date of Birth 3</th> <th>Dependent Child Name 4</th> <th>Dependent Date of Birth 4</th> <th>Dependent Child Name 5</th> <th>Dependent Date of Birth 5</th> <th>Dependent Child Name 6</th> <th>Dependent Date of Birth 6</th> <th>Dependent Child Name 7</th> <th>Dependent Date of Birth 7</th> </tr> </thead> <tbody> <tr> ... UPDATE REGARDING COMMENTS/ANSWERS I have received a number of responses indicating the number of headers may not match the field count in the body. As I mention below, eliminating the php script below altogether would eliminate 5+ fields in the header and without question throw the count match off balance. This DOES NOT however cause an error and in fact "resolves" the issue in that datatables functions properly (even though there is NO header record for 5+ fields in the body.

    Read the article

  • Jqgrid search option hides the grid table

    - by Felix Guerrero
    The issue is when I click on search option (on pager) it shows the search window but the grid gets hide. I'm including the jqmodal.js file. But what I'm ignoring on the code below? css files: jqModal.css jquery-ui-1.8.custom.css ui.jqgrid.css ui.multiselect.css jquery.searchFilter.css js files: jquery.min.js grid.base.js grid.common.js grid.formedit.js grid.setcolumns.js ui.multiselect.js jquery.searchFilter.js jqModal.js The Javascript: $("#list").jqGrid({ url: 'foo_report.php?g=' + $('#fooselect').val() + '&report=1&searchString=null&searchField=null&searchOper=null', datatype: 'json', mtype: 'GET', colNames: ['foo1','foo2', 'foo3'], colModel: [ { name:'rows.foobar1', index: 'foobar1', search:true, jsonmap: 'foobar1', width: 150, align: 'left', sortable:true}, { name:'rows.foobar2', index: 'foobar2', jsonmap: 'foobar2', width: 150, align: 'left'}, { name:'rows.foobar3', index: 'foobar3', jsonmap: 'foobar3', width: 240, align: 'left', sortable: true}], pager: '#pager', rowNum: 8, autowidth: true, rowList: [8, 16], sortname: 'foobar1', sortorder: 'asc', viewrecords: true, search : { caption: "Search...", Find: "Find", Reset: "Reset", odata : ['equal', 'not equal', 'less'], groupOps: [ { op: "AND", text: "all" }, { op: "OR", text: "any" }], matchText: " match", rulesText: " rules" }, caption: 'Foobar Data', jsonReader : { root: "rows", repeatitems: false }, height: 350, width: 800 }); html: <table id="list"></table> <div id="pager"></div>

    Read the article

  • After rich:extendedDataTable sortby,otheractions are not getting executed

    - by user118802
    I have a RichFaces UI which are having sidebar menu and sidebar had 8 links. I am using Seam @DataModel and @Factory and hibernate criteria to populate all the 8 pages. In all the pages i have sortby functionality which is working fine. I am able to get all data in all the 8 pages and I can freely navigate around all the links/xhtmls. But if in one of the xhtmlpages if I do sorting or groupby after that I am unable to navigate to other pages.If I select any other link the same last query which is executed for sorting is getting executed. Is this an issue? or do I need add any configuration. Please help me in solving this issue. Below is the codesnippet one of the 8 xhtml <rich:column sortable="true" sortBy="#{p.regionid}" width="100px" label="Region Id"> <f:facet name="header"> <h:outputText value="Region Id" /> </f:facet> <h:outputText value="#{p.regionid}" /> </rich:column> <rich:column sortable="true" sortBy="#{p.region}" width="100px" label="Region Name"> <f:facet name="header"> <h:outputText value="Region Name" /> </f:facet> <h:outputText value="#{p.region}" /> </rich:column> Sidebar Action @DataModel("regions") private List<CoreRegion> listRegions; @Factory("regions") public void getRegions() { System.out.println("Inside get Regions"); Session userDatabase = HibernateUtil.getSession(); Criteria crit = userDatabase.createCriteria(CoreRegion.class); listRegions = crit.list();

    Read the article

  • display tag query

    - by sarah
    I have code: <display:table name="sessionScope.allUserslist" id="userList" export="false" pagesize="1"> <display:column title="Select" style="width: 90px;"> <input type="checkbox" name="optionSelected" value="<c:out value='${userList.loginName}'/>"/> </display:column> <display:column property="loginName" sortable="false" title="UserName" paramId="loginName" style="width: 150px; text-align:center" href="./editUser.do?method=editUser"/> <display:column property="role" sortable="false" title="UserRole" paramId="role" style="width: 150px; text-align:center"/> </display:table> On click of login name, I am moving to a new page where I need to get all the of user, I am just getting the name not the role, on click of link I am calling an action where in the method I am trying to read the data from the form using User u=(User)form; u.getRole(); but it's null. Where am I going wrong ?

    Read the article

  • How to bind an ADF Table on button click

    - by Juan Manuel Formoso
    Coming from ASP.NET I'm having a hard time with basic ADF concepts. I need to bind a table on a button click, and for some reason I don't understand (I'm leaning towards page life cycle, which I guess is different from ASP.NET) it's not working. This is my ADF code: <af:commandButton text="#{viewcontrollerBundle.CMD_SEARCH}" id="cmdSearch" action="#{backingBeanScope.indexBean.cmdSearch_click}" partialSubmit="true"/> <af:table var="row" rowBandingInterval="0" id="t1" value="#{backingBeanScope.indexBean.transactionList}" partialTriggers="::cmdSearch" binding="#{backingBeanScope.indexBean.table}"> <af:column sortable="false" headerText="idTransaction" id="c2"> <af:outputText value="#{row.idTransaction}" id="ot4"/> </af:column> <af:column sortable="false" headerText="referenceCode" id="c5"> <af:outputText value="#{row.referenceCode}" id="ot7"/> </af:column> </af:table> This is cmdSearch_click: public String cmdSearch_click() { List l = new ArrayList(); Transaction t = new Transaction(); t.setIdTransaction(BigDecimal.valueOf(1)); t.setReferenceCode("AAA"); l.add(t); t = new Transaction(); t.setIdTransaction(BigDecimal.valueOf(2)); t.setReferenceCode("BBB"); l.add(t); setTransactionList(l); // AdfFacesContext.getCurrentInstance().addPartialTarget(table); return null; } The commented line also doesn't work. If I populate the list on my Bean's constructor, the table renders ok. Any ideas?

    Read the article

  • ExtJs Grid in TabPanel auto Fit issue.

    - by Jinah Adam
    Hi, I am having problems redering an grid in a a tab panel (Its made with Ext Designer.). the hierarchy is as follows , Viewport. - tabPanel - Panel - Container - Grid. This is how its displayed now Here is the code for viewport mainWindowUi = Ext.extend(Ext.Viewport, { layout: 'border', id: 'mainWindow', initComponent: function() { this.items = [ { xtype: 'panel', title: 'Navigation', region: 'west', width: 200, frame: true, split: true, titleCollapse: true, collapsible: true, id: 'navigation', items: [ { flex: 1, xtype: 'mytreepanel' } ] }, { xtype: 'tabpanel', layoutOnTabChange: true, resizeTabs: true, defaults: { layout: 'fit', autoScroll: true }, region: 'center', tpl: '', id: 'mainTabPanel', layoutConfig: { deferredRender: true } } ]; mainWindowUi.superclass.initComponent.call(this); } }); here is the code to create the tab.. (created from a nav panel programmatically) var currentTab = tabPanel.findById(node.id); // If not yet created, create the tab if (!currentTab){ currentTab = tabPanel.add({ title:node.id, id:node.id, closable:true, items:[{ xtype: 'phasePanel', layout: 'fit', autoscroll: true, }], autoScroll:true, }); } // Activate tab tabPanel.setActiveTab(currentTab); here is the code for the panel/container/grid PhasePanelUi = Ext.extend(Ext.Panel, { frame: true, layout: 'anchor', autoScroll: true, autoWidth: true, defaults: '', initComponent: function() { this.items = [ { xtype: 'container', autoScroll: true, layout: 'fit', defaults: { layout: 'fit', autoScroll: true }, id: 'gridHolder', items: [ { xtype: 'grid', title: 'Current Phases', store: 'PhaseStore', autoDestroy: false, viewConfig: '', deferRowRender: false, autoLoad: '', ref: '../phaseGrid', id: 'phaseGrid', columns: [ { xtype: 'gridcolumn', header: 'Name', dataIndex: 'name', sortable: true, width: 200 }, { xtype: 'gridcolumn', header: 'Estate', dataIndex: 'estate_name', sortable: true, width: 500 } ] } ] } ]; PhasePanelUi.superclass.initComponent.call(this); } }); i have tried all sorts of combinations. but just cant get the grid to render correctly any sort of assistance will be appreciated.

    Read the article

  • ExtJs getting the FormPanel that is created dynmaically from button click.

    - by sharad
    I have Extjs ViewPort panel, that contain center panel, that contain tablpanel, in which I have added gridpanel in one tab, on this I have put 'Add Person' button in tbar of , that will add a new tab of a FormPanel, in its Reset button, I am not able to access Form to reset it. Do any body have faced same issue... please help how to get it working. Ext.onReady( function(){ // Ext.get(document.body, true).toggleClass('xtheme-gray'); var myBorderPanel = new Ext.Viewport({ title: 'Software Releases', // renderTo: document.body, renderTo: Ext.getBody(), layout: 'border', id: 'main', items: [ { title: 'Center Region', region: 'center', // center region is required, no width/height specified tbar: [ { text: 'Add person', // only when user have write priovilege. handler: function() { var tabpanel = Ext.getCmp('main').findById('tabs'); var wtab = tabpanel.add({ // // var addrelease_win = new Ext.Window({ url: 'reledit-submit.json', id: 'addform0', // height: 300, width: 400, layout: 'form', frame: true, title: 'Add New Release', closable: true, items: [ { xtype: 'textfield', fieldLabel: 'Name' } buttons: [{ text: 'Save', scope: wtab, handler: function() { wtab.getForm().submit({ success: function(f,a) { Ext.Msg.alert('Success', 'It worked'); }, failure: function(f,a){ Ext.msg.alert('Warnning', 'Error'); } }); } },{ text: 'Reset', scope: wtab, handler: function() { // Ext.getCmp('addform0').getForm().reset(); // tabpanel.getActiveTab.reset(); // Ext.getCmp('main').findById('addform').getForm().reset(); // this.getForm().reset(); // this.getForm().reset(); // Ext.Msg.alert('sdfsd', 'asdfsd ' + Ext.getCmp('addform0').getValue() + ' sdfsd'); this.findById('addform0').getForm().reset(); // Ext.Msg.alert('sdfsd', 'asdfsd '); } }] }); // addrelease_win.show(); tabpanel.activate(tabpanel.items.length - 1); } } ], xtype: 'tabpanel', id: 'tabs', activeTab: 0, items: [{ title: 'Data', xtype: 'editorgrid', store: store, stripeRows: true, // autoExpandColumn: 'title', columns: [ {header: "Name" , dataIndex: "name" , width: 50, sortable: true}, {header: "DOB", dataIndex: "dob" , sortable: true} ], }) }], margins: '5 5 0 0' } ] }); }

    Read the article

  • javascript hide/show tabs using JQuery

    - by JohnMerlino
    Hey all, I have a quick question of how I can use jquery tabs (you click on link button to display/hide certain divs). The div id matches the href of the link: HTML links: <table class='layout tabs'> <tr> <td><a href="#site">Site</a></td> <td><a href="#siteno">Number</a></td> </tr> <tr> <td><a href="#student">Student</a></td> <td><a href="#school">School</a></td> </tr> </table> </div> div that needs to display/hide: <div id="site"> <table class='explore'> <thead class='ui-widget-header'> <tr> <th class=' sortable'> Site </th> <th class=' sortable'> Number </th> </tr> </thead> </table> </div> Thanks for any response.

    Read the article

  • Ruby on Rails + Jquery: Saving data from draggable lists

    - by sjsc
    Hello. I'm trying to save data to the MySQL database in Rails when the user drags items from different lists. I'm using the below Jquery script and HTML: <script> $(document).ready(function() { $("#draggable").draggable( { connectToSortable: 'ul#myList', helper:'clone' } ); $("#myList").sortable(); }); </script> HTML: <ul> <li id="draggable">Drag me to myList</li> </ul> <ul id="myList"> <li id="item-1">item 1</li> <li id="item-2">item 2</li> </ul> I know I probably have to use something like this: $.post({ url: 'lists/update', data: $('#myList').sortable("serialize") }); I've been Googling for the last few hours but can't seem to find how to save data between multiple lists using Rails. Any idea?

    Read the article

  • MySQL Query Where Column Like Column

    - by shmeeps
    I'm working on a small project that involves grabbing a list of contacts which are stored for each group. Essentially, the database is set up so that each group has a primary and secondary contact stored as, unsurprisingly, Group.Primary and Group.Secondary. The objective is to pull every Primary and Secondary contact for each Group and display them in a sortable table. I have the sortable table all worked out, but I have come across a small problem. Each primary and secondary field can have more than one contact separated by a comma. For instance, if Primary contained 123,256 , it would need to pull both Contacts with IDs 123 and 256. I had intended to use a query formatted like this: SELECT * FROM Group G, Contacts C WHERE G.Primary LIKE %C.ID% OR G.Secondary LIKE %C.ID% so that I could just skip the comma part, but I can't seem to find a working query for this. My question to you is, am I just overlooking something here? Is there a simple query that would let me do this? Or am I better off getting the groups and contacts separately, and combine the two later. I think the former is a little easier to understand when read, which is a plus as this is a shared project, but if that is not possible I will do the latter. This code is simplified, but it gets the point across.

    Read the article

  • JQUERY - how to get updated value after ajax removes data from within it?

    - by Brian
    I have a an element with thumbnails. I allow users to sort their display order (which fires off an update to the DB via ajax). I also allow them to delete images (which, after deletion, fires off a request to update the display order for all remaining images). My problem is with binding or live I think, but I don't know where to apply it. The array fired off upon delete contains ALL the ids for the images that were there on page load. The issue is that after they delete an image the array STILL contains the original ids (including the one that was deleted) so it is obviously not refreshing the value of the element after ajax has removed things from inside it. I need to tell it to go get the refreshed contents... From what I have been reading, this is normal but I don't understand how to tie it into my routine. I need to trigger the mass re-ordering after any deletion. Any ideas gurus? $('a.delimg').click(function(){ var parent = $(this).parent().parent(); var id = $(this).attr('id'); $.ajax({ type: "POST", url: "../updateImages.php", data: "action=delete&id=" + id, beforeSend: function() { parent.animate({'backgroundColor':'#fb6c6c'},300); $.jnotify("<strong>Deleting This Image & Updating The Image Order</strong>", 5000); }, success: function(data) { parent.slideUp(300,function() { parent.remove(); $("#images ul").sortable(function() { //NEEDS TO GET THE UPDATED CONTENT var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; $.post("../updateImages.php", order, function(theResponse){ $.jnotify("<strong>" + theResponse + "</strong>", 2000); }); }); }); } }); return false; }); Thanks for any help you can be.

    Read the article

  • jquery-ui drag and drop - how to dropped items?

    - by user246114
    Hi, I'm trying to use jquery-ui. I am using one of the drag and drop examples which is pretty much exactly what I need, except instead of moving items between the two lists, I'd like the items to be cloned: http://jqueryui.com/demos/sortable/#connect-lists $(function() { $("#sortable1, #sortable2").sortable({ connectWith: '.connectedSortable' }).disableSelection(); }); <ul id="sortable1" class="connectedSortable"> <li class="ui-state-default">Item 1</li> <li class="ui-state-default">Item 2</li> <li class="ui-state-default">Item 3</li> </ul> <ul id="sortable2" class="connectedSortable"> <li class="ui-state-default">Item 1</li> <li class="ui-state-default">Item 2</li> <li class="ui-state-default">Item 3</li> </ul> so moving an item from the first list to the second list results in list 1 have 2 items, and list 2 having 4 items. I just want it to make clones of the items on the drop. So in the above example, list 1 would still have 3 items, but list 2 would have 4 items, Thank you

    Read the article

  • ASP.NET Web API - Screencast series Part 4: Paging and Querying

    - by Jon Galloway
    We're continuing a six part series on ASP.NET Web API that accompanies the getting started screencast series. This is an introductory screencast series that walks through from File / New Project to some more advanced scenarios like Custom Validation and Authorization. The screencast videos are all short (3-5 minutes) and the sample code for the series is both available for download and browsable online. I did the screencasts, but the samples were written by the ASP.NET Web API team. In Part 1 we looked at what ASP.NET Web API is, why you'd care, did the File / New Project thing, and did some basic HTTP testing using browser F12 developer tools. In Part 2 we started to build up a sample that returns data from a repository in JSON format via GET methods. In Part 3, we modified data on the server using DELETE and POST methods. In Part 4, we'll extend on our simple querying methods form Part 2, adding in support for paging and querying. This part shows two approaches to querying data (paging really just being a specific querying case) - you can do it yourself using parameters passed in via querystring (as well as headers, other route parameters, cookies, etc.). You're welcome to do that if you'd like. What I think is more interesting here is that Web API actions that return IQueryable automatically support OData query syntax, making it really easy to support some common query use cases like paging and filtering. A few important things to note: This is just support for OData query syntax - you're not getting back data in OData format. The screencast demonstrates this by showing the GET methods are continuing to return the same JSON they did previously. So you don't have to "buy in" to the whole OData thing, you're just able to use the query syntax if you'd like. This isn't full OData query support - full OData query syntax includes a lot of operations and features - but it is a pretty good subset: filter, orderby, skip, and top. All you have to do to enable this OData query syntax is return an IQueryable rather than an IEnumerable. Often, that could be as simple as using the AsQueryable() extension method on your IEnumerable. Query composition support lets you layer queries intelligently. If, for instance, you had an action that showed products by category using a query in your repository, you could also support paging on top of that. The result is an expression tree that's evaluated on-demand and includes both the Web API query and the underlying query. So with all those bullet points and big words, you'd think this would be hard to hook up. Nope, all I did was change the return type from IEnumerable<Comment> to IQueryable<Comment> and convert the Get() method's IEnumerable result using the .AsQueryable() extension method. public IQueryable<Comment> GetComments() { return repository.Get().AsQueryable(); } You still need to build up the query to provide the $top and $skip on the client, but you'd need to do that regardless. Here's how that looks: $(function () { //--------------------------------------------------------- // Using Queryable to page //--------------------------------------------------------- $("#getCommentsQueryable").click(function () { viewModel.comments([]); var pageSize = $('#pageSize').val(); var pageIndex = $('#pageIndex').val(); var url = "/api/comments?$top=" + pageSize + '&$skip=' + (pageIndex * pageSize); $.getJSON(url, function (data) { // Update the Knockout model (and thus the UI) with the comments received back // from the Web API call. viewModel.comments(data); }); return false; }); }); And the neat thing is that - without any modification to our server-side code - we can modify the above jQuery call to request the comments be sorted by author: $(function () { //--------------------------------------------------------- // Using Queryable to page //--------------------------------------------------------- $("#getCommentsQueryable").click(function () { viewModel.comments([]); var pageSize = $('#pageSize').val(); var pageIndex = $('#pageIndex').val(); var url = "/api/comments?$top=" + pageSize + '&$skip=' + (pageIndex * pageSize) + '&$orderby=Author'; $.getJSON(url, function (data) { // Update the Knockout model (and thus the UI) with the comments received back // from the Web API call. viewModel.comments(data); }); return false; }); }); So if you want to make use of OData query syntax, you can. If you don't like it, you're free to hook up your filtering and paging however you think is best. Neat. In Part 5, we'll add on support for Data Annotation based validation using an Action Filter.

    Read the article

  • The ABC of Front End Web Development

    - by Geertjan
    And here it is, the long awaited "ABC" of front end web development, in which the items I never knew existed until I was looking to fill the gaps link off to the sites where more info can be found on them. A is for Android and AngularJS B is for Backbone.js and Bower C is for CSS and Cordova D is for Docker E is for Ember.js and Ext JS F is for Frisby.js G is for Grunt H is for HTML I is for Ionic and iPhone J is for JavaScript, Jasmine, and JSON K is for Knockout.js and Karma L is for LESS M is for Mocha N is for NetBeans and Node.js O is for "Oh no, my JS app is unmaintainable!" P is for PHP, Protractor, and PhoneGap Q is for Queen.js R is for Request.js S is for SASS, Selenium, and Sublime T is for TestFairy U is for Umbrella V is for Vaadin W is for WebStorm X is for XML Y is for Yeoman Z is for Zebra

    Read the article

  • Uploadify Not Working

    - by azz0r
    Hello, I'll re-edit this to tackle the uploadify issue. Its very strange, essentially the script isn't uploading and isn't triggering onAllComplete. Also if I try to upload an image that's to large, and click Upload files, it skips from 0 to 100%. But does not trigger onAllComplete. It does not upload either. Whats strange, is I have an earlier revision of this and the codes no different and it works, ive tried switched back to the same jquery/uploadify/layout and it still doesnt work. However due to the nature of uploadify not being very forthcoming about errors or whats going on, I can't figure out where its going wrong! Controller: public function manageImagesAction() { $id = $this->_getParam('id'); $object = Eurocreme_Gallery::load_by_fields(array('id' => $id), 1); $images = Eurocreme_Image::load_by_type(array('type' => 'gallery_id', 'values' => $id, 'from' => 0, 'to' => COUNT_HIGH, 'order' => 'gi.position ASC')); $this->view->object = $object; $this->view->images = $images; $this->view->headScript()->appendFile('/library/jquery/uploadify/swfobject.js'); $this->view->headScript()->appendFile('/library/jquery/uploadify/jquery.uploadify.v2.1.0.js'); $this->view->headScript()->appendFile('/library/jquery/ui.js'); } View: <div class="content-area"> <h1>Adding Images To "<?php echo $this->object->name; ?>" Gallery</h1> <p><input id="fileInput2" name="fileInput2" type="file" /></p> <p><a href="javascript:$('#fileInput2').uploadifyUpload();">Upload Files</a> | <a href="javascript:$('#fileInput2').uploadifyClearQueue();">Clear Queue</a></p> </div> <?php if (!empty($this->images)) { ?> <div class="content-area"> <h1>Order Images For <?php echo $this->object->name; ?></h1> <p id="status_update">Drop And Drag Images to re-order them, I will automatically save it for you!</p> <ul id="sort_list"> <?php foreach ($this->images as $image) { ?> <li class="removable" id="recordsArray_<?php echo $image->id; ?>"><img src="/images/Image/thumb/<?php echo $image->image_url; ?>" alt="<?php echo $image->name_url; ?>" title="<?php echo $image->name; ?>" /><p><a class="removable" id="<?php echo $image->id; ?>">Delete</a></p></li> <?php } ?> </ul> <p class="clear"></p> </div> <?php } ?> <?php $this->headScript()->captureStart(); ?> $('document').ready(function() { $("#fileInput2").uploadify({ 'uploader' : '/library/jquery/uploadify/uploadify.swf', 'script' : '/<?php echo $this->object->name_url; ?>/upload.php', 'cancelImg' : '/library/jquery/uploadify/cancel.png', 'folder' : '/images/Image/', 'multi' : true, 'onAllComplete' : function(e, queueId, file, response, data) { window.location.reload(); }, }) //sortable $(function() { $("#sort_list").sortable({ opacity: 0.6, cursor: 'move', update: function() { $("#status_update").html('Processing'); var order = $(this).sortable("serialize"); $.post("/administration/gallery/save-image-order/id/<?php echo $this->object->id; ?>", order, function(theResponse){ $("#status_update").html(theResponse); }); } }); //delete $('a.removable').click(function(){ var id = this.id; $.post("/administration/gallery/delete-image/gallery_id/<?php echo $this->object->id; ?>/image_id/"+id+"", '', function(theResponse) { $("#recordsArray_"+id+"").remove(); }); }); }); }); <?php $this->headScript()->captureEnd(); ?>

    Read the article

  • New hire expectations... (Am I being unreasonable?)

    - by user295841
    I work for a very small custom software shop. We currently consist me and my boss. My boss is an old FoxPro DOS developer and OOP makes him uncomfortable. He is planning on taking a back seat in the next few years to hopefully enjoy a “partial retirement”. I will be taking over the day to day operations and we are now desperately looking for more help. We tried Monster.com, Dice.com, and others a few years ago when we started our search. We had no success. We have tried outsourcing overseas (total disaster), hiring kids right out of college (mostly a disaster but that’s where I came from), interns (good for them, not so good for us) and hiring laid off “experienced” developers (there was a reason they were laid off). I have heard hiring practices discussed on podcasts, blogs, etc... and have tried a few. The “Fizz Buzz” test was a good one. One kid looked physically ill before he finally gave up. I think my problem is that I have grown so much as a developer since I started here that I now have a high standard. I hear/read very intelligent people podcasts and blogs and I know that there are lots of people out there that can do the job. I don’t want to settle for less than a “good” developer. Perhaps my expectations are unreasonable. I expect any good developer (entry level or experienced) to be billable (at least paying their own wage) in under one month. I expect any good developer to be able to be productive (at least dangerous) in any language or technology with only a few days of research/training. I expect any good developer to be able to take a project from initial customer request to completion with little or no help from others. Am I being unreasonable? What constitutes a valuable developer? What should be expected of an entry level developer? What should be expected of an experienced developer? I realize that everyone is different but there has to be some sort of expectations standard, right? I have been giving the test project below to potential canidates to weed them out. Good idea? Too much? Too little? Please let me know what you think. Thanks. Project ID: T00001 Description: Order Entry System Deadline: 1 Week Scope The scope of this project is to develop a fully function order entry system. Screen/Form design must be user friendly and promote efficient data entry and modification. User experience (Navigation, Screen/Form layouts, Look and Feel…) is at the developer’s discretion. System may be developed using any technologies that conform to the technical and system requirements. Deliverables Complete source code Database setup instructions (Scripts or restorable backup) Application installation instructions (Installer or installation procedure) Any necessary documentation Technical Requirements Server Platform – Windows XP / Windows Server 2003 / SBS Client Platform – Windows XP Web Browser (If applicable) – IE 8 Database – At developer’s discretion (Must be a relational SQL database.) Language – At developer’s discretion All data must be normalized. (+) All data must maintain referential integrity. (++) All data must be indexed for optimal performance. System must handle concurrency. System Requirements Customer Maintenance Customer records must have unique ID. Customer data will include Name, Address, Phone, etc. User must be able to perform all CRUD (Create, Read, Update, and Delete) operations on the Customer table. User must be able to enter a specific Customer ID to edit. User must be able to pull up a sortable/queryable search grid/utility to find a customer to edit. Validation must be performed prior to database commit. Customer record cannot be deleted if the customer has an order in the system. (++) Inventory Maintenance Part records must have unique ID. Part data will include Description, Price, UOM (Unit of Measure), etc. User must be able to perform all CRUD operations on the part table. User must be able to enter a specific Part ID to edit. User must be able to pull up a sortable/queryable search grid/utility to find a part to edit. Validation must be performed prior to database commit. Part record cannot be deleted if the part has been used in an order. (++) Order Entry Order records must have a unique auto-incrementing key (Order Number). Order data must be split into a header/detail structure. (+) Order can contain an infinite number of detail records. Order header data will include Order Number, Customer ID (++), Order Date, Order Status (Open/Closed), etc. Order detail data will include Part Number (++), Quantity, Price, etc. User must be able to perform all CRUD operations on the order tables. User must be able to enter a specific Order Number to edit. User must be able to pull up a sortable/queryable search grid/utility to find an order to edit. User must be able to print an order form from within the order entry form. Validation must be performed prior to database commit. Reports Customer Listing – All Customers in the system. Inventory Listing – All parts in the system. Open Order Listing – All open orders in system. Customer Order Listing – All orders for specific customer. All reports must include sorts and filter functions where applicable. Ex. Customer Listing by range of Customer IDs. Open Order Listing by date range.

    Read the article

  • Passing ViewModel for backbone.js from MVC3 Server-Side

    - by Roman
    In ASP.NET MVC there is Model, View and Controller. MODEL represents entities which are stored in database and essentially is all the data used in a application (for example, generated by EntityFramework, "DB First" approach). Not all data from model you want to show in the view (for example, hashs of passwords). So you create VIEW MODEL, each for every strongly-typed-razor-view you have in application. Like this: using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace MyProject.ViewModels.SomeController.SomeAction { public class ViewModel { public ViewModel() { Entities1 = new List<ViewEntity1>(); Entities2 = new List<ViewEntity2>(); } public List<ViewEntity1> Entities1 { get; set; } public List<ViewEntity2> Entities2 { get; set; } } public class ViewEntity1 { //some properties from original DB-entity you want to show } public class ViewEntity2 { } } When you create complex client-side interfaces (I do), you use some pattern for javascript on client, MVC or MVVM (I know only these). So, with MVC on client you have another model (Backbone.Model for example), which is third model in application. It is a bit much. Why don`t we use the same ViewModel model on a client (in backbone.js or another framework)? Is there a way to transfer CS-coded model to JS-coded? Like in MVVM pattern, with knockout.js, when you can do like this: in SomeAction.cshtml: <div style="display: none;" id="view_model">@Json.Encode(Model)</div> after that in Javascript-code var ViewModel = ko.mapping.fromJSON($("#view_model").get(0).innerHTML); now you can extend your ViewModel with some actions, event handlers, etc: ko.utils.extend(ViewModel, { some_function: function () { //some code } }); So, we are not building the same view model on the client again, we are transferring existing view model from server. At least, data. But knockout.js is not suitable for me, you can`t build complex UI with it, it is just data-binding. I need something more structural, like backbone.js. The only way to build ViewModel for backbone.js I can see now is re-writing same ViewModel in JS from server with hands. Is there any ways to transfer it from server? To reuse the same viewmodel on server view and client view?

    Read the article

  • Do you start migrating your Swing project to JavaFX

    - by Yan Cheng CHEOK
    I have a 4 years old project which is written in Swing + SwingX. Currently, it is still alive and still kicking. However, as more GUI related feature requests coming in (For instance, a sortable tree table), I start to feel the difficulty in fulling the requests. This is true especially there isn't active development going around SwingX project. Also, I hardly can find any good, yet being actively maintained/ developed/ evolving GUI Java framework. I was wondering, any of Swing developers feel the same thing? Have you start to migrate your Swing project to a much more active developed GUI framework like JavaFX?

    Read the article

  • Qué control te gustaria?

    - by Jason Ulloa
    Cada vez, utilizó mas Jquery para enriquecer las aplicaciones que desarrollo, pero cada vez me doy cuenta de que siempre debo leer la documentación de los controles para poder recordar todas las funciones. Esto, sumado a la cantidad de código script que debo colocar en las páginas. Es por eso que decidi empezar a trabajar en una pequeña seríe de controles de Jquery para asp.net basado en el framework DJ Jquery. Por supuesto, una serie de controles OpenSource para la comunidad   Actualmente los controles disponibles son: * Accordion * Animation * Autocomplete * DatePicker * Dialog * Draggable * Droppable * Effect * FileUpload * FlexGrid (en desarrollo) * Floater Menu * JMenu (en desarrollo) * Jquery Plugin * Password Meter * ProgressBar * Resizable * Selectable * Slick Menu * Slider * Sortable * Tabs * ButtonEx * Toggle Button * Simple Button * Simple List View   Así que la idea es preguntarles: ¿Qué otro control les gustaría ver en la suite?   Saludos,

    Read the article

  • Is there a modern (eg NoSQL) web analytics solution based on log files?

    - by Martin
    I have been using Awstats for many years to process my log files. But I am missing many possibilities (like cross-domain reports) and I hate being stuck with extra fields I created years ago. Anyway, I am not going to continue to use this script. Is there a modern apache logs analytics solution based on modern storage technologies like NoSQL or at least somehow ready to cope with large datasets efficiently? I am primarily looking for something that generates nice sortable and searchable outputs with the focus on web analytics, before having to write my own frontends. (so graylog2 is not an option) This question is purely about log file based solutions.

    Read the article

  • JQGrid with Column Reordering

    - by bruno
    Hey guys, I have a jqgrid and I can reorder my columns with this option in my JQGrid jQuery("#list").jqGrid({ sortable: true, ... }); This functionality let me reorder ALL my columns. But I want that some columns must be on fixed places. Is there a way to solve this..? Thanks in advance! Bruno

    Read the article

  • jqGrid add item checkbox field defaulted to checked

    - by gurun8
    Here's a simple question. I have a jqGrid that's working great but I want set the default value for a checkbox to checked when user adds a new item. Here's a snippet of code: {name: "Active", index: "active", width: 80, align: "center", sortable: false, editable: true, edittype: "checkbox", editoptions: {value: "Yes:No"}} I don't see anything in the documentation: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules

    Read the article

  • Drupal: Exposing a module's data to Views2 using its API

    - by Sepehr Lajevardi
    I'm forking the filefield_stats module to provide it with the ability of exposing data into the Views module via the API. The filefield_stats module db table schema is as follow: <?php function filefield_stats_schema() { $schema['filefield_stats'] = array( 'fields' => array( 'fid' => array('type' => 'int', 'unsigned' => TRUE, 'not null' => TRUE, 'description' => 'Primary Key: the {files}.fid'), 'vid' => array('type' => 'int', 'unsigned' => TRUE, 'not null' => TRUE, 'description' => 'Primary Key: the {node}.vid'), 'uid' => array('type' => 'int', 'unsigned' => TRUE, 'not null' => TRUE, 'description' => 'The {users}.uid of the downloader'), 'timestamp' => array('type' => 'int', 'unsigned' => TRUE, 'not null' => TRUE, 'description' => 'The timestamp of the download'), 'hostname' => array('type' => 'varchar', 'length' => 128, 'not null' => TRUE, 'default' => '', 'description' => 'The hostname downloading the file (usually IP)'), 'referer' => array('type' => 'text', 'not null' => FALSE, 'description' => 'Referer for the download'), ), 'indexes' => array('fid_vid' => array('fid', 'vid')), ); return $schema; } ?> Well, so I implemented the hook_views_api() in filefield_stats.module & added a filefield_stats.views.inc file in the module's root directory, here it is: <?php // $Id$ /** * @file * Provide the ability of exposing data to Views2, for filefield_stats module. */ function filefield_stats_views_data() { $data = array(); $data['filefield_stats']['table']['group'] = t('FilefieldStats'); // Referencing the {node_revisions} table. $data['filefield_stats']['table']['join'] = array( 'node_revisions' => array( 'left_field' => 'vid', 'field' => 'vid', ), /*'files' => array( 'left_field' => 'fid', 'field' => 'fid', ), 'users' => array( 'left_field' => 'uid', 'field' => 'uid', ),*/ ); // Introducing filefield_stats table fields to Views2. // vid: The node's revision ID which wrapped the downloaded file $data['filefield_stats']['vid'] = array( 'title' => t('Node revision ID'), 'help' => t('The node\'s revision ID which wrapped the downloaded file'), 'relationship' => array( 'base' => 'node_revisions', 'field' => 'vid', 'handler' => 'views_handler_relationship', 'label' => t('Node Revision Reference.'), ), ); // uid: The ID of the user who downloaded the file. $data['filefield_stats']['uid'] = array( 'title' => t('User ID'), 'help' => t('The ID of the user who downloaded the file.'), 'relationship' => array( 'base' => 'users', 'field' => 'uid', 'handler' => 'views_handler_relationship', 'label' => t('User Reference.'), ), ); // fid: The ID of the downloaded file. $data['filefield_stats']['fid'] = array( 'title' => t('File ID'), 'help' => t('The ID of the downloaded file.'), 'relationship' => array( 'base' => 'files', 'field' => 'fid', 'handler' => 'views_handler_relationship', 'label' => t('File Reference.'), ), ); // hostname: The hostname which the file has been downloaded from. $data['filefield_stats']['hostname'] = array( 'title' => t('The Hostname'), 'help' => t('The hostname which the file has been downloaded from.'), 'field' => array( 'handler' => 'views_handler_field', 'click sortable' => TRUE, ), 'sort' => array( 'handler' => 'views_handler_sort', ), 'filter' => array( 'handler' => 'views_handler_filter_string', ), 'argument' => array( 'handler' => 'views_handler_argument_string', ), ); // referer: The referer address which the file download link has been triggered from. $data['filefield_stats']['referer'] = array( 'title' => t('The Referer'), 'help' => t('The referer which the file download link has been triggered from.'), 'field' => array( 'handler' => 'views_handler_field', 'click sortable' => TRUE, ), 'sort' => array( 'handler' => 'views_handler_sort', ), 'filter' => array( 'handler' => 'views_handler_filter_string', ), 'argument' => array( 'handler' => 'views_handler_argument_string', ), ); // timestamp: The time of the download. $data['filefield_stats']['timestamp'] = array( 'title' => t('Download Time'), 'help' => t('The time of the download.'), 'field' => array( 'handler' => 'views_handler_field_date', 'click sortable' => TRUE, ), 'sort' => array( 'handler' => 'views_handler_sort_date', ), 'filter' => array( 'handler' => 'views_handler_filter_date', ), ); return $data; } // filefield_stats_views_data() ?> According to the Views2 documentations this should work as a minimum, I think. But it doesn't! Also there is no error of any kind, when I come through the views UI, there's nothing about filefield_stats data. Any idea?

    Read the article

< Previous Page | 7 8 9 10 11 12 13 14 15 16 17 18  | Next Page >