Search Results

Search found 20733 results on 830 pages for 'ui design'.

Page 208/830 | < Previous Page | 204 205 206 207 208 209 210 211 212 213 214 215  | Next Page >

  • Using jQueryUI datepicker inside a jQuery BlockUI dialogue

    - by stan4th
    Hi, trying to get a jQueryUI datepicker working within a jQuery blockUI dialogue but it appears behind the blockUI dialogue, i.e. in the blanked out area, and when trying to choose a date it disappears but the value not posted. js code is simply; $('#datePicker').datepicker({ inline: true }); against which is part of the blockUI markup to create the dialogue. Using; jquery-1.3.2.min.js jquery-ui-1.7.2.custom.min.js jquery.blockUI.js Cheers

    Read the article

  • design of orm tool

    - by ifree
    Hello , I want to design a orm tool for my daily work, but I'm always worry about the mapping of foreign key. Here's part of my code: using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Data; namespace OrmTool { [AttributeUsage(AttributeTargets.Property)] public class ColumnAttribute:Attribute { public string Name { get; set; } public SqlDbType DataType { get; set; } public bool IsPk { get; set; } } [AttributeUsage(AttributeTargets.Class,AllowMultiple=false,Inherited=false)] public class TableAttribute:Attribute { public string TableName { get; set; } public string Description { get; set; } } [AttributeUsage(AttributeTargets.Property)] public class ReferencesAttribute : ColumnAttribut { public Type Host { get; set; } public string HostPkName{get;set;} } } I want to use Attribute to get the metadata of Entity ,then mapping them,but i think it's really hard to get it done; public class DbUtility { private static readonly string CONNSTR = ConfigurationManager.ConnectionStrings["connstr"].ConnectionString; private static readonly Type TableType = typeof(TableAttribute); private static readonly Type ColumnType = typeof(ColumnAttribute); private static readonly Type ReferenceType = typeof(ReferencesAttribute); private static IList<TEntity> EntityListGenerator<TEntity>(string tableName,PropertyInfo[] props,params SqlParameter[] paras) { return null; } private static IList<TEntity> ResultList() { return null; } private static SqlCommand PrepareCommand(string sql,SqlConnection conn,params SqlParameter[] paras) { SqlCommand cmd = new SqlCommand(); cmd.CommandText = sql; cmd.Connection = conn; if (paras != null) cmd.Parameters.AddRange(paras); conn.Open(); return cmd; } } I don't know how to do the next step, if every Entity has it's own foreign key,how do I get the return result ? If the Entity like this: [Table(Name="ArtBook")] public class ArtBook{ [column(Name="id",IsPk=true,DataType=SqlDbType.Int)] public int Id{get;set;} [References(Name="ISBNId",DataType=SqlDataType.Int,Host=typeof(ISBN),HostPkName="Id")] public ISBN BookISBN{get;set;} public .....more properties. } public class ISBN{ public int Id{get;set;} public bool IsNative{get;set;} } If I read all ArtBooks from database and when I get a ReferencesAttribute how do I set the value of BookISBN?

    Read the article

  • jQuery Dialog causing buttons not to post-back

    - by jonathanconway
    I'm using the jQuery UI Dialog() function on an ASP.NET webform, on a particular panel. After Dialog() is applied, the buttons become useless and will not post back at all; I'm not even getting a Page_Load event firing, let alone any button events. Is the Dialog function messing with my button events? If so, is there a way to fix this?

    Read the article

  • Sockets server design advice

    - by Rob
    We are writing a socket server in c# and need some advice on the design. Background: Clients (from mobile devices) connect to our server app and we leave their socket open so we can send data back down to them whenever we need to. The amount of data varies but we generally send/receive data from each client every few seconds, so it's quite intensive. The amount of simultaneous connections can range from 50-500 (and more in the future). We have already written a server app using async sockets and it works, however we've come across some stumbling blocks and we need to make sure that what we're doing is correct. We have a collection which holds our client states (we have no socket/connection pool at the moment, should we?). Each time a client connects we create a socket and then wait for them to send us some data and in receiveCallBack we add their clientstate object to our connections dictionary (once we have verified who they are). When a client object then signs off we shutdown their socket and then close it as well as remove them from our collection of clients dictionary. Presumably everything happens in the right order, everything works as expected. However, almost everyday it stops accepting connections, or so we think, either that or it connects but doesn't actually do anything past that and we can't work out why it's just stopping. There are few things that we'r'e unsure about 1) Should we be creating some kind of connection pool as opposed to just a dictionary of client sockets 2) What happens to the sockets that connect but then don't get added to our dictionary, they just linger around in memory doing nothing, should we create ANOTHER dictionary that holds the sockets as soon as they are created? 3) What's the best way of finding if clients are no longer connected? We've read some many methods but we're not sure of the best one to use, send data or read data, if so how? 4) If we loop through the connections dictonary to check for disposed clients, should we be locking the dictionary, if so how does this affect other clients objects trying to use it at the same time, will it throw an error or just wait? 5) We often get disposedSocketException within ReceiveCallBack method at random times, does this mean we are safe to remove that socket from the collection? We can't seem to find any production type examples which show any of this working. Any advice would be greatly received

    Read the article

  • how to create drop down button like gmail "move to" button?

    - by keisimone
    Hi i have a simple file upload system coded in php. As part of increasing the UI simplicity, i want to have a similar gmail "Move To" button where I can check multiple checkboxes and then after clicking one of the many possible entries in the drop down generated by the button, some postback takes place. Please advise. Thank you. Ideally, would be to use jQuery. though i am not an expert, i have some small experience using jQuery.

    Read the article

  • How to use imported css styles in GWT correctly

    - by Eduard Wirch
    Imagine you created the following simple widget with UiBinder: <!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> <ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui"> <ui:style type="my.package.Widget1.Widget1Style"> .childWidgetStyle { border-width: 1px; border-style: dotted; } </ui:style> <g:TextArea styleName="{style.childWidgetStyle}"/> </ui:UiBinder> package my.package; // some imports here public class Widget1 extends Composite { private static Widget1UiBinder uiBinder = GWT.create(Widget1UiBinder.class); interface Widget1UiBinder extends UiBinder<Widget, Widget1> { } public interface Widget1Style extends CssResource { String childWidgetStyle(); } @UiField TextArea textArea; public Widget1(String text) { initWidget(uiBinder.createAndBindUi(this)); textArea.setText(text); } } Than you use this simple widget in another (parent) widget you created: <!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> <ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui"> <ui:style> .parentWidgetStyle .childWidgetStyle { margin-bottom: 10px; } </ui:style> <g:VerticalPanel ui:field="listPanel" addStyleNames="{style.parentWidgetStyle}" /> </ui:UiBinder> package my.package; // imports go here public class ParentWidget extends Composite { private static ParentWidgetUiBinder uiBinder = GWT.create(ParentWidgetUiBinder.class); interface ParentWidgetUiBinder extends UiBinder<Widget, ParentWidget> { } @UiField VerticalPanel listPanel; public ParentWidget(final String... texts) { initWidget(uiBinder.createAndBindUi(this)); for (final String text : texts) { final Widget1 entry = new Widget1(text); listPanel.add(entry); } } } What you want to achieve is to get some margin between the Widget1 entries in the list using css. But this won't work. Because GWT will obfuscate the css names. And the obfuscated name for .childWidgetStyle in ParentWidget will be different from the .childWidgetStyle in Widget1. The resulting css will look similar to this: .G1unc9fbE { border-style:dotted; border-width:1px; } .G1unc9fbBB .G1unc9fDa { margin-bottom:10px; } So the margin setting wont apply. How do I do this correctly?

    Read the article

  • Design-time failure: WPF, Usercontrols and Namespaces

    - by Simon Woods
    Hi I have a very simple WPF project comprising a Window and Usercontrol. I'm very much in a learning phase. It works fine when I run it. However, I am unable to see the form in design time. The problem, I believe is something to do with namespaces, but I don't understand where. It may well be a simple error Main Window XML <Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:views="clr-namespace:UserLogin" x:Class="UserLogin.MainView" x:Name="MainViewWindow" mc:Ignorable="d" Title="Login" Height="141" Width="347" > <Grid> <views:LoginView /> </Grid> </Window> Main Window CodeBehind Imports Microsoft.VisualBasic Imports System Imports System.Windows Imports UserLogin Namespace UserLogin Partial Public Class MainView Inherits System.Windows.Window Public Sub New() InitializeComponent() End Sub End Class End Namespace Usercontrol XAML <UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" x:Class="UserLogin.LoginView" x:Name="LoginViewControl" mc:Ignorable="d" d:DesignHeight="96" d:DesignWidth="298"> <Grid Height="96" Width="298"> <Button Command="{Binding OKCommand}" Height="21" Margin="0,0,90,16" Name="btnOK" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="76">OK</Button> <Button Command="{Binding CancelCommand}" Height="21" HorizontalAlignment="Right" Margin="0,0,9,16" Name="btnCancel" VerticalAlignment="Bottom" Width="75">Cancel</Button> <Label Height="23" HorizontalAlignment="Left" Margin="10,5,0,0" Name="Label1" VerticalAlignment="Top" Width="85">Name:</Label> <Label HorizontalAlignment="Left" Margin="10,32,0,0" Name="Label2" Width="85" Height="29" VerticalAlignment="Top">Password:</Label> <TextBox Margin="0,31,6,0" Name="txtPassword" Height="22" VerticalAlignment="Top" HorizontalAlignment="Right" Width="182" /> <ComboBox Height="22" Margin="110,6,6,0" Name="cboNames" VerticalAlignment="Top" /> </Grid> </UserControl> Usercontrol CodeBehind Imports Microsoft.VisualBasic Imports System Imports UserLogin Namespace UserLogin Partial Public Class LoginView Inherits System.Windows.Controls.UserControl Public Sub New() InitializeComponent() End Sub End Class End Namespace I think I'm missing something this namespace xmlns:views="clr-namespace:UserLogin" since intellisense doesn't give me the usercontrol declared within it in the XAML designer but rather reports the error "Unable to load the metadata for the assembly ... etc etc" Thx for any suggestions Simon

    Read the article

  • How to auto apply drag and drop effect to dynamically added element ?

    - by Relax
    I use jquery ui to apply a drag and drop effect on a serial of DIVs, for example: <div class="draggable">...</div> <div class="draggable">...</div> <div class="draggable">...</div> <div class="draggable"> this DIV was dynamically added, not draggable </div> The problem is dynamically added DIVs won't have this effect applied, how can i apply this effect on new members too?

    Read the article

  • Using jQuery live() to initialize plugins?

    - by cxfx
    Using jQuery, what's the best way to automatically initialize a plugin on all current and future elements of a specific class? For example, say I want all <input type="text" class="datepicker" /> elements to have the jQuery UI Datepicker plugin, including any I might create at runtime. Essentially, I want to do something like this: $('.datepicker').live('create', function() { $(this).datepicker(); }); But, of course, there isn't a create event I can use.

    Read the article

  • Linked List Design

    - by Jim Scott
    The other day in a local .NET group I attend the following question came up: "Is it a valid interview question to ask about Linked Lists when hiring someone for a .NET development position?" Not having a computer sciense degree and being a self taught developer my response was that I did not feel it was appropriate as I in 5 years of developer with .NET had never been exposed to linked lists and did not hear any compeling reason for a use for one. However the person commented that it is a very common interview question so I decided when I left that I would do some reasearch on linked lists and see what I might be missing. I have read a number of posts on stack overflow and various google searches and decided the best way to learn about them was to write my own .NET classes to see how they worked from the inside out. Here is my class structure Single Linked List Constructor public SingleLinkedList(object value) Public Properties public bool IsTail public bool IsHead public object Value public int Index public int Count private fields not exposed to a property private SingleNode firstNode; private SingleNode lastNode; private SingleNode currentNode; Methods public void MoveToFirst() public void MoveToLast() public void Next() public void MoveTo(int index) public void Add(object value) public void InsertAt(int index, object value) public void Remove(object value) public void RemoveAt(int index) Questions I have: What are typical methods you would expect in a linked list? What is typical behaviour when adding new records? For example if I have 4 nodes and I am currently positioned in the second node and perform Add() should it be added after or before the current node? Or should it be added to the end of the list? Some of the designs I have seen explaining things seem to expose outside of the LinkedList class the Node object. In my design you simply add, get, remove values and know nothing about any node object. Should the Head and Tail be placeholder objects that are only used to define the head/tail of the list? I require my Linked List be instantiated with a value which creates the first node of the list which is essentially the head and tail of the list. Would you change that ? What should the rules be when it comes to removing nodes. Should someone be able to remove all nodes? Here is my Double Linked List Constructor public DoubleLinkedList(object value) Properties public bool IsHead public bool IsTail public object Value public int Index public int Count Private fields not exposed via property private DoubleNode currentNode; Methods public void AddFirst(object value) public void AddLast(object value) public void AddBefore(object existingValue, object value) public void AddAfter(object existingValue, object value) public void Add(int index, object value) public void Add(object value) public void Remove(int index) public void Next() public void Previous() public void MoveTo(int index)

    Read the article

  • Help with jQuery Traversal

    - by Jack Webb-Heller
    Hi guys, I'm struggling a bit with traversing in jQuery. Here's the relevant markup: <ul id="sortable" class="ui-sortable"> <li> <img src="http://ecx.images-amazon.com/images/I/51Vza76tCxL._SL160_.jpg"> <div class="controls"> <span class="move">?</span> <span class="delete">?</span> </div> <div class="data"> <h1>War and Peace (Oxford World's Classics)</h1> <textarea>Published to coincide with the centenary of Tolstoy's death, here is an exciting new edition of one of the great literary works of world literature.</textarea> </div> </li> <li> <img src="http://ecx.images-amazon.com/images/I/51boZxm2seL._SL160_.jpg"> <div class="controls"> <span class="move">?</span> <span class="delete">?</span> </div> <div class="data"> <h1>A Christmas Carol and Other Christmas Writings (Penguin Classics)</h1> <span>Optionally, write your own description in the box below.</span> <textarea>Dicken's Christmas writings-in a new, sumptuous, and delightful clothbound edition.</textarea> </div> </li> </ul> This is code for a jQuery UI 'Sortable' element. Here's what I want to happen. When the Delete thing is clicked ($('.delete')), I want the <li> item it's contained within to be removed. I've tried using $('.delete').parent().parent().remove(); but in the case of having two items, that seems to delete both of them. I'm a bit confused by this. I also tried using closest() to find the closest li, but that didn't seem to work either. How should I best traverse the DOM in this case? Thanks! Jack

    Read the article

  • How to design this ?

    - by Akku
    how can i make this entire process as 1 single event??? http://code.google.com/apis/visualization/documentation/dev/dsl_get_started.html and draw the chart on single click? I am new to servlets please guide me When a user clicks the "go " button with some input. The data goes to the servlet say "Test3". The servlet processes the data by the user and generates/feeds the data table dynamically Then I call the html page to draw the chart as shown in the tutorial link above. The problem is when I call the servlet it gives me a long json string in the browser as given in the tutorials "google.visualization.Query.setResponse({version:'0.6',status:'ok',sig:'1333639331',table:{cols:[{............................" Then when i manually call the html page to draw the chart i am see the chart. But when I call html page directly using the request dispatcher via the servlet I dont get the result. This is my code and o/p...... I need sugession as to how should be my approach to call the chart public class Test3 extends HttpServlet implements DataTableGenerator { protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { DataSourceHelper.executeDataSourceServletFlow(request, response, this , isRestrictedAccessMode() ); RequestDispatcher rd; rd = request.getRequestDispatcher("new.html");// it call's the html page which draws the chart as per the data added by the servlet..... rd.include(request, response);//forward(request, response); @Override public Capabilities getCapabilities() { return Capabilities.NONE; } protected boolean isRestrictedAccessMode() { return false; } @Override public DataTable generateDataTable(Query query, HttpServletRequest request) { // Create a data table. DataTable data = new DataTable(); ArrayList<ColumnDescription> cd = new ArrayList<ColumnDescription>(); cd.add(new ColumnDescription("name", ValueType.TEXT, "Animal name")); cd.add......... I get the following result along with unprocessed html page google.visualization.Query.setResponse({version:'0.6',statu..... <html> <head> <title>Getting Started Example</title> .... Entire html page as it is on the Browser. What I need is when a user clicks the go button the servlet should process the data and call the html page to draw the chart....Without the json string appearing on the browser.(all in one user click) What should be my approach or how should i design this.... there are no error in the code. since when i run the servlet i get the json string on the browser and then when i run the html page manually i get the chart drawn. So how can I do (servlet processing + html page drawing chart as final result) at one go without the long json string appearing on the browser. There is no problem with the html code....

    Read the article

  • How to set property only on second column of a ListView?

    - by Lernkurve
    Introduction I have a ListView and want to format only the second column. The following XAML code does that: <ListView x:Name="listview"> <ListView.View> <GridView> <GridViewColumn Header="Property" DisplayMemberBinding="{Binding Path=Key}" Width="100"/> <!-- <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Path=Value}" Width="250">--> <GridViewColumn Header="Value" Width="250"> <GridViewColumn.CellTemplate> <DataTemplate> <TextBlock Text="{Binding Path=Value}" Foreground="CornflowerBlue" AutomationProperties.Name={Binding Path="Key"}/> </DataTemplate> </GridViewColumn.CellTemplate> </GridViewColumn> </GridView> </ListView.View> </ListView> The one problem I have is that the AutomationProperties.Name property is not being set. I was checking it with the Coded UI Test Builder and the property is empty. The Text and the Foreground property are being set correctly. Question Does anyone know why AutomationProperties.Name is not being set? Additional information Strangly enough, the following XAML code does set the AutomationProperties.Name <ListView x:Name="listview"> <ListView.Resources> <Style TargetType="TextBlock"> <Setter Property="AutomationProperties.Name" Value="{Binding Key}"/> </Style> </ListView.Resources> <ListView.View> <GridView> <GridViewColumn Header="Property" DisplayMemberBinding="{Binding Path=Key}" Width="100"/> <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Path=Value}" Width="250"/> </GridView> </ListView.View> </ListView> The problem here though is that AutomationProperties.Name is being set on all the columns. But I only want it on the second one because otherwise my Coded UI Test code returns the wrong value (that of the first column, instead of that of the second column which I want).

    Read the article

  • jQueryUI Tabs: how to keep them on a single line?

    - by Andi
    Hi all, Maybe my question is wired: is there a way to prevent jQueryUI tabs from floating if browser window is too small? Explanation: I have a simple horizontal tab using CSS only. The content is floating but not the tabs. Important: there is no width set manually, the current width is taken automatically. Here is the code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <style type="text/css"> #tabs ul { white-space: nowrap; } #tabs ul li { display: inline; white-space: nowrap; } </style> <title>Tabs-CSS</title> </head> <body> <div class="demo"> <div id="tabs"> <ul> <li><a href="#tabs-1">Preloaded</a></li> <li><a href="ajax/content1.html">Tab 1</a></li> <li><a href="ajax/content2.html">Tab 2</a></li> <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> </ul> <div id="tabs-1"> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> </div> </div> </div> </body> </html> This is exactly what I want. Next step: add jQueryUI Tab as unobtrusive Javascript. For example like this: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> <link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" rel="stylesheet"/> <style type="text/css"> #tabs ul { white-space: nowrap; } #tabs ul li { display: inline; white-space: nowrap; } </style> <title>Tabs-CSS</title> </head> <body> <div class="demo"> <div id="tabs"> <ul> <li><a href="#tabs-1">Preloaded</a></li> <li><a href="ajax/content1.html">Tab 1</a></li> <li><a href="ajax/content2.html">Tab 2</a></li> <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> </ul> <div id="tabs-1"> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> </div> </div> </div> <script type="text/javascript"> //<![CDATA[ $(function() { $("#tabs").tabs({ ajaxOptions: { error: function(xhr, status, index, anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo."); }, } }); }); $(function() { $("#innertabs").tabs({ ajaxOptions: { error: function(xhr, status, index, anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo."); } } }); }); //]]> </script> </body> </html> Now I can see that the tabbar floats on minimizing the browser window. And there are some ugly effect with the tabs jumping around. My main questions is: can I avoid floating the tabbar and keep all tabs on one single line? Kind regards, Andi

    Read the article

  • jQueryUI Tabs: how too keep them on a single line?

    - by Andi
    Hi all, Maybe my question is wired: is there a way to prevent jQueryUI tabs from floating if browser window is too small? Explanation: I have a simple horizontal tab using CSS only. The content is floating but not the tabs. Important: there is no width set manually, the current width is taken automatically. Here is the code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <style type="text/css"> #tabs ul { white-space: nowrap; } #tabs ul li { display: inline; white-space: nowrap; } </style> <title>Tabs-CSS</title> </head> <body> <div class="demo"> <div id="tabs"> <ul> <li><a href="#tabs-1">Preloaded</a></li> <li><a href="ajax/content1.html">Tab 1</a></li> <li><a href="ajax/content2.html">Tab 2</a></li> <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> </ul> <div id="tabs-1"> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> </div> </div> </div> </body> </html> This is exactly what I want. Next step: add jQueryUI Tab as unobtrusive Javascript. For example like this: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> <link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" rel="stylesheet"/> <style type="text/css"> #tabs ul { white-space: nowrap; } #tabs ul li { display: inline; white-space: nowrap; } </style> <title>Tabs-CSS</title> </head> <body> <div class="demo"> <div id="tabs"> <ul> <li><a href="#tabs-1">Preloaded</a></li> <li><a href="ajax/content1.html">Tab 1</a></li> <li><a href="ajax/content2.html">Tab 2</a></li> <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> </ul> <div id="tabs-1"> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> </div> </div> </div> <script type="text/javascript"> //<![CDATA[ $(function() { $("#tabs").tabs({ ajaxOptions: { error: function(xhr, status, index, anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo."); }, } }); }); $(function() { $("#innertabs").tabs({ ajaxOptions: { error: function(xhr, status, index, anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo."); } } }); }); //]]> </script> </body> </html> Now I can see that the tabbar floats on minimizing the browser window. And there are some ugly effect with the tabs jumping around. My main questions is: can I avoid floating the tabbar and keep all tabs on one single line? Kind regards, Andi

    Read the article

  • jQuery slider not visible after container div is toggled

    - by Shahar Evron
    I have a page which contains a jQuery-UI horizontal slider, created using a little function, inside a div which can be displayed / hidden by clicking on it's title, using $.toggle(). Problem is, once the div is hidden, when it is expanded the slider is gone. A simplified demo of the problem can be seen here: http://arr.gr/jquery-issue.html (file contains all relevant source code) - when clicking the "Advanced Options" title to hide and then show the div, the slider is no longer there. Any suggestions on how to work around this?

    Read the article

  • jQuery - draggable images on iPad / iPhone - how to integrate event.preventDefault();?

    - by Tim
    Hello! I use jQuery, jQuery UI and jQuery mobile to build a web application for iPhone / iPad. Now I create images and they should be draggable, so I did this: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>Drag - Test</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" /> <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script> <script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js"></script> </head> <body> <div> <div style="width:500px;height:500px;border:1px solid red;"> <img src="http://upload.wikimedia.org/wikipedia/en/thumb/9/9e/JQuery_logo.svg/200px-JQuery_logo.svg.png" class="draggable" alt="jQuery logo" /> <img src="http://upload.wikimedia.org/wikipedia/en/a/ab/Apple-logo.png" class="draggable" alt="Apple Inc. logo" /> </div> </div> </body> <script type="text/javascript"> $(document).ready(function() { $(".draggable").draggable(); }); </script> </html> Here you can see the live example: http://jsbin.com/igena4/ The problem is, that the whole page want to scroll. I searched in Apple's HTML5 examples and found this to prevent the scrolling of the page, so that the image is draggable: ... onDragStart: function(event) { // stop page from panning on iPhone/iPad - we're moving a note, not the page event.preventDefault(); ... } But the problem is for me, how can I include this into my jQuery? Where do I get event? Best Regards.

    Read the article

  • Advice for Architecture Design Logic for software application

    - by Prasad
    Hi, I have a framework of basic to complex set of objects/classes (C++) running into around 500. With some rules and regulations - all these objects can communicate with each other and hence can cover most of the common queries in the domain. My Dream: I want to provide these objects as icons/glyphs (as I learnt recently) on a workspace. All these objects can be dragged/dropped into the workspace. They have to communicate only through their methods(interface) and in addition to few iterative and conditional statements. All these objects are arranged finally to execute a protocol/workflow/dataflow/process. After drawing the flow, the user clicks the Execute/run button. All the user interaction should be multi-touch enabled. The best way to show my dream is : Jeff Han's Multitouch Video. consider Jeff is playing with my objects instead of the google maps. :-) it should be like playing a jigsaw puzzle. Objective: how can I achieve the following while working on this final product: a) the development should be flexible to enable provision for web services b) the development should enable easy web application development c) The development should enable client-server architecture - d) further it should also enable mouse based drag/drop desktop application like Adobe programs etc. I mean to say: I want to economize on investments. Now I list my efforts till now in design : a) Created an Editor (VB) where the user writes (manually) the object / class code b) On Run/Execute, the code is copied into a main() function and passed to interpreter. c) Catch the output and show it in the console. The interpreter can be separated to become a server and the Editor can become the client. This needs lot of standard client-server architecture work. But some how I am not comfortable in the tightness of this system. Without interpreter is there much faster and better embeddable solution to this? - other than writing a special compiler for these objects. Recently learned about AXIS-C++ can help me - looks like - a friend suggested. Is that the way to go ? Here are my questions: (pl. consider me a self taught programmer and NOT my domain) a) From the stage of C++ objects to multi-touch product, how can I make sure I will develop the parallel product/service models as well.? What should be architecture aspects I should consider ? b) What technologies are best suited for this? c) If I am thinking of moving to Cloud Computing, how difficult/ how redundant / how unnecessary my efforts will be ? d) How much time in months would it take to get the first beta ? I take the liberty to ask if any of the experts here are interested in this project, please email me: [email protected] Thank you for any help. Looking forward.

    Read the article

  • jQuery TypeError: example("input#autocomplete").autocomplete is not a function

    - by Ankush Kalia
    I have tried alot to remove this error but could not get success.When i am running this script on localhost its working fine but not working on Joomla frame work. The code is below: <!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> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <?php $viewFields=array('c++', 'java', 'php', 'coldfusion', 'javascript', 'asp', 'ruby'); ?> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script> var example=jQuery.noConflict(); var arrayFromPHP = <?php echo json_encode($viewFields) ?>; example(document).ready(function() { example("input#autocomplete").autocomplete({ source: arrayFromPHP }); }); </script> </head> <body> <center> <p><img src="<?php echo JURI::base(); ?>images/search_1.png" border="0" alt="" /> <img src="<?php echo JURI::base(); ?>images/business_2.png" border="0" alt="" /> <img src="<?php echo JURI::base(); ?>images/review_3.png" border="0" alt="" /> </p> </center> <input id="autocomplete" /> </body> </html> Its giving me this error:- -- [08:30:24.870] Use of getAttributeNode() is deprecated. Use getAttribute() instead. @ http://50.116.97.120/~amarhost/storage/media/system/js/mootools-core.js:343 [08:30:27.853] TypeError: example("input#autocomplete").autocomplete is not a function @ http://50.116.97.120/~amarhost/storage/index.php/component/storage/?action=war&Itemid=105:210

    Read the article

  • Cancel draggable dragging

    - by JohnM2
    I have a draggable (jquery-ui) element. I subscribe to it's 'drag' event. How can I cancel current draggig based on some constraints? So I want to constraint possible moves of this draggable element, but it is more custom then only based on axis or parent (containment). How can I do that?

    Read the article

  • Problems with JQuery's Droppable Tolerance 'fit' feature when using the same size divs

    - by Chris
    Hi I'm just wondering if anybody else can manage to get the tolerance:'fit' option to work when using the 'droppable' feature in jQuery's UI? I want to call a function only when the draggable div is dropped perfectly onto a droppable div. Both divs are the same size and I'm using snapMode:outer to help the end user. I simply cannot get it to work with 'fit'. Works perfectly with 'intersect'. Would really appreciate some help. Thanks Chris

    Read the article

< Previous Page | 204 205 206 207 208 209 210 211 212 213 214 215  | Next Page >