Search Results

Search found 22765 results on 911 pages for 'jquery layout'.

Page 431/911 | < Previous Page | 427 428 429 430 431 432 433 434 435 436 437 438  | Next Page >

  • using Unity Android In a sub view and add style and actionbar

    - by aeroxr1
    I exported a simple animation from Unity3D (version 4.5) in android project. With eclipse I modified the manifest and added another activity. In this activity I put a button that it makes start the animation,and this is the result. The action bar appear in the main activity but it doesn't in the unity's activity :( This is the unity's activity's code : package com.rabidgremlin.tut.redcube; import android.app.NativeActivity; import android.content.res.Configuration; import android.graphics.PixelFormat; import android.os.Bundle; import android.view.KeyEvent; import android.view.MotionEvent; import android.view.View; import android.view.ViewGroup; import android.view.Window; import android.view.WindowManager; import com.unity3d.player.UnityPlayer; public class UnityPlayerNativeActivity extends NativeActivity { protected UnityPlayer mUnityPlayer; // don't change the name of this variable; referenced from native code // Setup activity layout @Override protected void onCreate (Bundle savedInstanceState) { //requestWindowFeature(Window.FEATURE_NO_TITLE); super.onCreate(savedInstanceState); getWindow().takeSurface(null); //setTheme(android.R.style.Theme_NoTitleBar_Fullscreen); getWindow().setFormat(PixelFormat.RGB_565); mUnityPlayer = new UnityPlayer(this); /*if (mUnityPlayer.getSettings ().getBoolean ("hide_status_bar", true)) getWindow ().setFlags (WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); */ setContentView(mUnityPlayer); mUnityPlayer.requestFocus(); } // Quit Unity @Override protected void onDestroy () { mUnityPlayer.quit(); super.onDestroy(); } // Pause Unity @Override protected void onPause() { super.onPause(); mUnityPlayer.pause(); } // eliminiamo questa onResume() e proviamo a modificare la onResume() // Resume Unity @Override protected void onResume() { super.onResume(); mUnityPlayer.resume(); } // inseriamo qualche modifica qui // This ensures the layout will be correct. @Override public void onConfigurationChanged(Configuration newConfig) { super.onConfigurationChanged(newConfig); mUnityPlayer.configurationChanged(newConfig); } // Notify Unity of the focus change. @Override public void onWindowFocusChanged(boolean hasFocus) { super.onWindowFocusChanged(hasFocus); mUnityPlayer.windowFocusChanged(hasFocus); } // For some reason the multiple keyevent type is not supported by the ndk. // Force event injection by overriding dispatchKeyEvent(). @Override public boolean dispatchKeyEvent(KeyEvent event) { if (event.getAction() == KeyEvent.ACTION_MULTIPLE) return mUnityPlayer.injectEvent(event); return super.dispatchKeyEvent(event); } // Pass any events not handled by (unfocused) views straight to UnityPlayer @Override public boolean onKeyUp(int keyCode, KeyEvent event) { return mUnityPlayer.injectEvent(event); } @Override public boolean onKeyDown(int keyCode, KeyEvent event) { return mUnityPlayer.injectEvent(event); } @Override public boolean onTouchEvent(MotionEvent event) { return mUnityPlayer.injectEvent(event); } /*API12*/ public boolean onGenericMotionEvent(MotionEvent event) { return mUnityPlayer.injectEvent(event); } } How can I add the action bar and the style of the first activity to unity's animation activity ?

    Read the article

  • <plugin> not a function

    - by bah
    Hi, I've been trying to solve this mystery almost 2 hours, this is giving me a headache. I tried 2 plug-ins already and I'm always getting "* is not a function". My code is exactly like examples so I don't know why it's not working. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>asd</title> <script type="text/javascript" src="jquery.js"></script> <script type='text/javascript' src='serial/jquery.scrollTo'></script> <script type='text/javascript' src='serial/jquery.serialScroll'></script> <script type="text/javascript"> $(document).ready(function(){ $('#slider').serialScroll({ items:'li', offset:-230, //when scrolling to photo, stop 230 before reaching it (from the left) start:1, //as we are centering it, start at the 2nd duration:1200, force:true, stop:true, lock:false, cycle:false, //don't pull back once you reach the end easing:'easeOutQuart', //use this easing equation for a funny effect jump: true //click on the images to scroll to them }); }); </script> </head> <body> <div id="slider"> <ul> <li><img width="500" height="500" src="dummy/dummy.jpg" alt="Css Template Preview" /></li> <li><img width="500" height="500" src="dummy/dummy1.jpg" alt="Css Template Preview" /></li> <li><img width="500" height="500" src="dummy/dummy2.jpg" alt="Css Template Preview" /></li> <li><img width="500" height="500" src="dummy/dummy3.jpg" alt="Css Template Preview" /></li> </ul> </div> </body> </html> I must be missing something essential there because I see nothing what's wrong. I'm using jQuery 1.4.2. and there are plug-ins I've tried - Easy Slider, jQuery serial scroll

    Read the article

  • Block element text overflow problem in IE7

    - by Adomas
    I'm making a "sort elements" web game using jQuery, HTML & CSS. While everything works fine in FF, IE8, Opera, Chrome, I'm having problem with IE7 wrapping words inside block elements. Here's how it looks in IE7 (wrong): Link (cannot post images as a new user) In IE8 the box with wrapped text would just expand to fit it whole in one line without any overflows. Sorry, can't give another link as a new user Don't mind the element order as it's random. Elements are dynamically generated by jQuery. HTML code: <div class="ui-sortable" id="area"> <span class="object">: </span> <span class="object">1998- </span> <span class="object">ISSN 1392-4087</span> <span class="object">, </span> <span class="object">. </span> <span class="object">nepriklausomas savaitraštis buhalteriams, finansininkams, auditoriams</span> <span class="object">. </span> <span class="object">. </span> <span class="object">. </span> <span class="object">Vilnius</span> <span class="object">1998- </span> <span class="object"><em>Apskaitos, audito ir mokesciu aktualijos</em></span> </div> CSS code (irrelevant info like fonts & colors removed): #area { min-height: 160px; width: 760px; } .object { display: block; float: left; text-align: center; width: auto; } Any comments on why does IE7 does that? How do I make these spans expand to fit the whole text in one line in IE7 and not wrap the text or make overflows?

    Read the article

  • Sanity Check: change event not firing first time using keyboard

    - by macca1
    I've done a good amount of research on this and found a bunch of reported problems and solutions but the general consensus seems that all change problems in IE6 were fixed in jQuery 1.4.2. I'm having an issue where a change event is not firing in jQuery 1.4.2, but it did fire successfully in jQuery 1.3.2. This is in IE6. I'm about to submit a bug for this, but for my sanity I wanted to post it here first to see if there's something dumb I'm missing. I don't understand why this is working this way... <HTML> <HEAD> <TITLE>jQuery 1.4.2 Problem </TITLE> <script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script> $(document).ready( function() { $("#firstBox").change(function() { alert("CHANGE"); }); // ONLOAD of document autofocus into the first element... $("form").find(":input:visible:first").focus() }); </script> </HEAD> <BODY> <form> <select id="firstBox"> <option value="" selected="selected">--</option> <option value="1">One</option> <option value="2">Two</option> </select> <br><br> <input size="10" id="secondBox"> </form> </BODY> </HTML> Simple enough, right? Onload of the page, give the first element focus. Onchange of the first element, alert. If you use the mouse, it works as expected. The page loads, the focus is in the drop down, you change the option, you get the alert. The problem is if you use the keyboard. The page loads, the focus is in the drop down, you press the down arrow. The option changes. Tab off the field, no alert. Weird. To make it even weirder, if you tab back into the field and change it again (all using the keyboard), the change event DOES fire after tab out this time. Any ideas?

    Read the article

  • How to Load Dependent Files on Demand + Check if They're Loaded or Not?

    - by br4inwash3r
    I'm trying to implement an assets/dependency loader that i've found from an old article at 24Ways.org. most of you might be familiar with it. it's from this article by Christian Heilmann: http://24ways.org/2007/keeping-javascript-dependencies-at-bay i've modified the script to load CSS files as well. and it's now quite close to what i want. but i still need to do some checking to see wether an asset have been completely loaded or not. just wondering if you guys have any ideas :) here's what my script currently looked like: var assetLoader = { assets: { products: { js: 'products.js', css: 'products.css', loaded: false }, articles: { js: 'articles.js', css: 'articles.css', loaded: false }, [...] cycle: { js: 'jquery.cycle.min.js', loaded: false }, swfobject: { js: 'jquery.swfobject.min.js', loaded: false } }, add: function(asset) { var comp = assetLoader.assets[asset]; var path = '/path/to/assets/'; if (comp && comp.loaded == false) { if (comp.js) { // load js var js = document.createElement('script'); js.src = path + 'js/' + comp.js; js.type = 'text/javascript'; js.charset = 'utf-8'; // append to document document.getElementsByTagName('body')[0].appendChild(js); } if (comp.css) { // load css var css = document.createElement('link'); css.rel = 'stylesheet'; css.href = path + 'css/' + comp.css; css.type = 'text/css'; css.media = 'screen, projection'; css.charset = 'utf-8'; // append to document document.getElementsByTagName('head')[0].appendChild(css); } } }, check: function(asset) { assetLoader.assets[asset].loaded = true; } } Christian explains this method in his article in great detail. I don't want to confuse you guys anymore with my bad english :P and here's an example of how i run the script: ... // load jquery cycle plugin if (page=='tvc' || page=='products') { if (!assetLoader.assets.cycle.loaded) { assetLoader.add('cycle'); } } // load products page assets if (!assetLoader.assets.products.loaded) { assetLoader.add('products'); } ... this kind of approach is very problematic though. coz assets loads asynchronously, which means some of the code inside products.js that depends on jquery.cycle.js might continue running before jquery.cycle.js is even loaded resulting in errors. while i'm quite aware that scripts can be attached with an onload event, i'm just not really sure how to implement it to my script. anyone care to help me? please... :P

    Read the article

  • Flexslider position of previous and next slides

    - by TJ15
    I am using the basic flexslider, I wantto display some of the previous and next , so if slide 2 is showing you will see part of slide 1 to the left and part of slide 3 to the right. <!DOCTYPE html> <head> <link rel="stylesheet" href="flexslider.css" type="text/css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <style> .container {overflow: hidden; width: 100%} .flexslider {max-width: 500px; width: 500px; margin: 0 auto} .content {background: #f2f2f2; max-width: 500px; display: block; margin: 0 auto} .flex-viewport {overflow: visible !important} </style> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <div class="container"> <div class="flexslider"> <ul class="slides"> <li><img src="785.jpg" /></li> <li><img src="785.jpg" /></li> <li><img src="785.jpg" /></li> <li><img src="785.jpg" /></li> </ul> </div> </div> <script src="jquery.flexslider.js"></script> <script> jQuery(document).ready(function($) { // You can use the locally-scoped $ in here as an alias to jQuery. $(window).load(function() { $('.flexslider').flexslider(); }); }); </script> </body> </html> I have reduced the image to 70% and positioned it in the middle of the page. I want to have the next and previous slides visible on either side of the main pic but no idea where to make the appropriate changes (I assume in the js file). I thought this was a margin issue but setting this to 0 in styles makes no difference. Has anyone done this and can provide some advice?

    Read the article

  • How to refresh a GridView?

    - by Daniel
    Hello everyone, I have a GridView which is pretty similar to the Google tutorial, except that I want to add the ImageViews on runtime (via a subactivity). The results are okay, but the layout of the View is messed up: The GridView doesn't fill the content of its parent, what do I have to do to design it properly? Here the code of adding the children: public void initializeWorkbench(GridView gv, Vector<String> items) { Prototype.workbench.setDimension(screenWidth, divider.height()+workbenchArea.height()); Prototype.workbench.activateWorkbench(); // this measures the workbench correctly Log.d(Prototype.TAG, "workbench width: "+Prototype.workbench.getMeasuredWidth()); // 320 Log.d(Prototype.TAG, "workbench height: "+Prototype.workbench.getMeasuredHeight()); // 30 ImageAdapter imgAdapter = new ImageAdapter(this.getContext(), items); gv.setAdapter(imgAdapter); gv.measure(screenWidth, screenHeight); gv.requestLayout(); gv.forceLayout(); Log.d(Prototype.TAG, "gv width: "+gv.getMeasuredWidth()); // 22 Log.d(Prototype.TAG, "gv height: "+gv.getMeasuredHeight()); // 119 Prototype.workbench.setDimension(screenWidth, divider.height()+workbenchArea.height()); } } activateWorkbench, setDimension and measure in the workbench (LinearLayout above the GridView): public void activateWorkbench() { if(this.equals(Prototype.workbench)) { this.setOrientation(VERTICAL); show = true; measure(); } } public void setDimension(int w, int h) { width = w; height = h; this.setLayoutParams(new LinearLayout.LayoutParams(width, height)); this.invalidate(); } private void measure() { if (this.getOrientation() == LinearLayout.VERTICAL) { int h = 0; int w = 0; this.measureChildren(0, 0); for (int i = 0; i < this.getChildCount(); i++) { View v = this.getChildAt(i); h += v.getMeasuredHeight(); w = (w < v.getMeasuredWidth()) ? v.getMeasuredWidth() : w; } if (this.equals(Prototype.tagarea)) height = (h < height) ? height : h; if (this.equals(Prototype.tagarea)) width = (w < width) ? width : w; } this.setMeasuredDimension(width, height); } The ImageAdapter constructor: public ImageAdapter(Context c, Vector<String> items) { mContext = c; boolean mExternalStorageAvailable = false; boolean mExternalStorageWriteable = false; String state = Environment.getExternalStorageState(); if (Environment.MEDIA_MOUNTED.equals(state)) { // We can read and write the media mExternalStorageAvailable = mExternalStorageWriteable = true; } else if (Environment.MEDIA_MOUNTED_READ_ONLY.equals(state)) { // We can only read the media mExternalStorageAvailable = true; mExternalStorageWriteable = false; } else { // Something else is wrong. It may be one of many other states, but // all we need // to know is we can neither read nor write mExternalStorageAvailable = mExternalStorageWriteable = false; } if (mExternalStorageAvailable && mExternalStorageWriteable) { for (String item : items) { File f = new File(item); if (f.exists()) { try { FileInputStream fis = new FileInputStream(f); Bitmap b = BitmapFactory.decodeStream(fis); bitmaps.add(b); files.add(f); } catch (FileNotFoundException e) { Log.e(Prototype.TAG, "", e); } } } } } And the xml layout: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:gravity="bottom" android:paddingLeft="0px" android:paddingTop="0px" android:paddingRight="0px"> <com.unimelb.pt3.ui.TransparentPanel android:id="@+id/workbench" android:layout_width="fill_parent" android:layout_height="10px" android:paddingTop="0px" android:paddingLeft="0px" android:paddingBottom="0px" android:paddingRight="0px"> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/gridview" android:layout_width="fill_parent" android:layout_height="fill_parent" android:columnWidth="90dp" android:numColumns="auto_fit" android:verticalSpacing="10dp" android:horizontalSpacing="10dp" android:stretchMode="columnWidth" android:gravity="center" /> </com.unimelb.pt3.ui.TransparentPanel> </LinearLayout>

    Read the article

  • Issue with blocking the UI during a onchange request - prevents other event from firing.

    - by jfrobishow
    I am having issues with jQuery blockUI plugins and firing two events that are (I think, unless I am loosing it) unrelated. Basically I have textboxes with onchange events bound to them. The event is responsible for blocking the UI, doing the ajax call and on success unblocking the UI. The ajax is saving the text in memory. The other control is a button with on onclick event which also block the UI, fire an ajax request saving what's in memory to the database and on success unblock the UI. Both of these work fine separately. The issue arise when I trigger the onchange by clicking on the button. Then only the onchange is fired and the onclick is ignored. I can change the text in the checkbox, click on the link and IF jQuery.blockUI() is present the onchange alone is fired and the save is never called. If I remove the blockUI both function are called. Here's a fully working example where you can see the issue. Please note the setTimeout are there when I was trying to simulate the ajax delay but the issue is happening without it. <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script src="http://github.com/malsup/blockui/raw/master/jquery.blockUI.js?v2.31"></script> <script> function doSomething(){ $.blockUI(); alert("doing something"); //setTimeout(function(){ $.unblockUI(); //},500); } function save(){ $.blockUI(); //setTimeout(function(){ alert("saving"); $.unblockUI(); //}, 1000); } </script> </head> <body> <input type="text" onchange="doSomething();"> <a href="#" onclick="save()">save</a> </body> </html>

    Read the article

  • Calling back a functions value

    - by Jason Kelly
    I need your help, I cannot, for the life of me, figure this out. I've had my head wrapped around it only to no avail. Ideally, i'd like to setup two functions. 1 function: select_date() to interact with the user to select a date from the jQuery Date picker. If the dialog is closed then return as null. Then a second function: test() to check wether or not a date was picked/selected.' Here's my delema, when the function test() is executed, an alert box pops up and says "undefined" which means, I never get to select a date and it always being "undefined" I dont see what I am doing wrong here and everything seems logical to me. <!DOCTYPE html> <html> <head> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.js"></script> <script type="text/javascript"> function select_date() { var sdate $('#dd').dialog({ autoOpen: true, modal: true, overlay: { opacity: 0.5, background: 'black' }, title: "title", height: 265, width: 235, draggable: false, resizable: false }); $('#d1').datepicker({ onSelect: function () { $("#dd").dialog("close"); } }); return sdate } function test() { var x = select_date() alert(x) } </script> <style type="text/css"> #d1 {font-size:64%;} </style> </head> <body> <div id="dd"> <div id="d1"> </div> </div> <a href="javascript:test()">test</a> </body> </html>

    Read the article

  • display image and run script for fifteen seconds

    - by Ryan Max
    This is very similar to a question I asked the other day but my page code has become significantly more complicated and I need to revisit it. I've been using the following code: $('#myLink').click(function() { $('#myImg').attr('src', 'newImg.jpg'); setTimeout(function() { $('#myImg').attr('src', 'oldImg.jpg'); }, 15000); }); To replace an image for a set period of time (15 seconds) when the link is clicked, then after 15 seconds, revert to the original image. However now, I'd like to run a snippet of javascript as well when the link is clicked (in addition to replacing the image), and only when the link is clicked (it's related to the 15 second image) and then have the js code disappear as well after the 15 seconds...however I'm not sure how to have jquery send js code into the page...Basically I just want jQuery to "echo" this code onto the page underneath the 15 second while I am there, but I don't know how jquery formats this "echo". Does this question make sense? interval = 500; imgsrc = "webcam/image.jpg"; function Refresh() { tmp = new Date(); tmp = "?" + tmp.getTime(); document.images["image1"].src = imgsrc + tmp; setTimeout("Refresh()", interval); } Refresh(); It's script for a webcam. Basically it takes a new picture every half a second and replaces it on the page. You must forgive me, I'm new to jquery, I don't know how to make this script work in a jquery context. i'm sorry, I'm explaining badly. This is what I need to happen, step by step: 1) User comes to the page and there is a static image that says "Click here to view webcam" 2) User clicks image 3) Image is replaced by live webcam image, which is refreshed every .5 seconds by the second script in my question. 4) After 15 seconds the live webcam reverts back to the static image saying "click here to view webcam" It is ONLY during that 15 second interval that I wan the webcam refresh script running, otherwise it's wasting bandwidth on an element that isn't even shown. Sorry for the confusion.

    Read the article

  • Android how to match text with images by pointing text and images with lines

    - by Shirisha
    I am trying to create app which is match text with appropriate images by pointing with line. I want to create app exactly same which is shown in the below image: can any one please give me an idea? This is my main class: public class MatchActivity extends Activity { ArrayAdapter<String> listadapter; float x1; float y1; float x2; float y2; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); String[] s1 = { "smiley1", "smiley2", "smiley3" }; ListView lv = (ListView) findViewById(R.id.text_list); ArrayList<String> list = new ArrayList<String>(); list.addAll(Arrays.asList(s1)); listadapter = new ArrayAdapter<String>(this, R.layout.rowtext, s1); lv.setAdapter(listadapter); GridView gv = (GridView) findViewById(R.id.image_list); gv.setAdapter(new ImageAdapter(this)); lv.setOnItemClickListener(new OnItemClickListener() { public void onItemClick(AdapterView<?> arg0, View v, int arg2, long arg3){ x1=v.getX(); y1=v.getY(); Log.d("list","text positions x1:"+x1+" y1:"+y1); } }); gv.setOnItemClickListener(new OnItemClickListener() { public void onItemClick(AdapterView<?> arg0, View v, int arg2, long arg3){ DrawView draw=new DrawView(MatchActivity.this); x2=v.getX(); y2=v.getY(); draw.position1.add(x1); draw.position1.add(y1); draw.position2.add( x2); draw.position2.add(y2); Log.d("list","image positions x2:"+x2+" y2:"+y2); LinearLayout ll=LinearLayout)findViewById(R.id.draw_line); ll.addView(draw); } }); } } This is my drawing class to draw a line: public class DrawView extends View { Paint paint = new Paint(); private List<Float> position1=new ArrayList<Float>(); private List<Float> position2=new ArrayList<Float>();; public DrawView(Context context) { super(context); invalidate(); Log.d("drawview","In DrawView class position1:"+position1+" position2:"+position2) ; } @Override public void onDraw(Canvas canvas) { super.onDraw(canvas); Log.d("on draw","IN onDraw() position1:"+position1+" position2:"+position2); assert position1.size() == position2.size(); for (int i = 0; i < position1.size(); i += 2) { float x1 = position1.get(i); float y1 = position1.get(i + 1); float x2 = position2.get(i); float y2 = position2.get(i + 1); paint.setColor(Color.BLACK); paint.setStrokeWidth(3); canvas.drawLine(x1,y1, x2,y2, paint); } } } Thanks in advance .

    Read the article

  • Pass data to another page

    - by user2331416
    I am trying to pass some data from one page to another page by using jquery but it dose not working, below is the code which I want to click the text in source page and the destination page will hide the current text. Source page: <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript"> $(function () { $("a.pass").bind("click", function () { var url = "Destination.html?name=" + encodeURIComponent($("a.pass").text()); window.location.href = url; }); }); </script> </head> <body> <a class="pass">a</a><br /> <a class="pass">b</a><br /> <a class="pass">c</a><br /> <a class="pass">d</a> </body> </html> Destination page: <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript"> var queryString = new Array(); $(function () { if (queryString.length == 0) { if (window.location.search.split('?').length > 1) { var params = window.location.search.split('?')[1].split('&'); for (var i = 0; i < params.length; i++) { var key = params[i].split('=')[0]; var value = decodeURIComponent(params[i].split('=')[1]); queryString[key] = value; } } } if (queryString["name"] != null) { var data = queryString["name"] $("p.+'data'").hide(); } }); </script> </head> <body> <p class="a">a</p> <p class="b">b</p> <p class="c">c</p> <p class="d">d</p> </body> </html> Please Help.

    Read the article

  • MVC 2 jQuery Client-side Validation

    - by nmarun
    Well, I watched Phil Haack’s show What's New in Microsoft ASP.NET MVC 2 and was impressed about the client-side validation (starts at 17:45) that MVC 2 offers. I tried creating the same, but Phil does not show what .js files need to be included and also I was not able to find the source code for the application that he used. In order to find out the required JavaScript file references, I added all of the files in my application to the page and ran it. Of course it worked, but this is definitely not an optimum solution. By removing one at a time and testing the app, I’ve short-listed the following ones: 1: <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script 2: <script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script> 3: <script src="../../Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script> Now, a little about the feature itself. Say, I’m working with a Book application so my model will look something like: 1: public class Book 2: { 3: [HiddenInput(DisplayValue = false)] 4: public int BookId { get; set; } 5:  6: [DisplayName("Book Title")] 7: [Required(ErrorMessage = "Book title is required")] 8: [StringLength(20, ErrorMessage = "Must be under 20 characters")] 9: public string Title { get; set; } 10:  11: [Required(ErrorMessage = "Author is required")] 12: [StringLength(40, ErrorMessage = "Must be under 40 characters")] 13: public string Author { get; set; } 14:  15: public decimal Price { get; set; } 16: 17: [DisplayName("ISBN")] 18: [StringLength(13, ErrorMessage = "Must be 13 characters")] 19: public string Isbn { get; set; } 20: } This ensures that the data passed will be validated upon post. But what would happen if you add the line (along with the above mentioned .js files): 1: <% Html.EnableClientValidation(); %> Now, this acts as ‘on-the-fly’ or ‘real-time’ validation. Now, when the user types 20 characters for the Title, the error shows up right on the 21st character. Beautiful… and you do not have to create the JavaScript function(s) for this. They’re auto-magically created for you. (Doing a ‘View Source’ on the browser page shows you the JavaScript logic that goes on behind the scenes). I bumped into another post that shows how .net 4 allows us to create custom validation attributes: Dynamic Range validation in MVC 2. This will help us attach virtually any business logic to the model itself. Please see the source code I’ve worked with.

    Read the article

  • jqGrid dynamic select option - beforeEditCell not firing

    - by mango
    I'm creating a jqgrid with one drop down column. I need the options of the drop down columns to change dynamically so I thought I can catch the beforeCellEdit event. however it does not seem to be firing. any idea on what i am doing wrong? there is no error, and i did check that i have included the jqgrid edit js files. var lastsel2; jQuery(document).ready(function(){ jQuery("#projectList").jqGrid({ datatype: 'json', url:'projectDrv.jsp', mtype: 'GET', height: 250, colNames:['Node','Proposal #', 'Status', 'Vendor', 'Actions'], colModel :[ {name:'node', index:'node', width:100, editable:false, sortable:false}, {name:'proposal', index:'proposal', width:100, editable:false, resizable:true }, {name:'status', index:'status', width:100, resizable:true, sortable:false, editable:false }, {name:'vendor', index:'vendor', width:100, resizable:true, editable:false, sortable: false }, {name:'actions', index:'actions', width:100, resizable:true, sortable:false, editable: true, edittype:"select" } ], pager: '#pager', rowNum: 10, sortname: 'proposal', sortorder: 'desc', viewrecords: true, onSelectRow: function(id){ if (id && id!==lastsel2){ jQuery('#projectList').jqGrid('restoreRow',lastsel2); jQuery('#projectList').jqGrid('editRow',id,true); lastsel2 = id; } }, beforeEditCell: function(rowid, cellname, value, irow, icol) { alert("before edit here " + rowid); // set editoptions here } });

    Read the article

  • CSS issue with elements spanning columns

    - by bigFoot
    Hi folks. Overview: I'm trying to create a relatively simple page layout detailed below and running into problems no matter how I try to approach it. Concept: - A standard-size-block layout. I'll quote unit widths: each content block is 240px square with 5px of margin around it. - A left column of fixed width of 1 unit (245px - 1 block + margin to left). No problems here. - A right column of variable width to fill the remaining space. No problems here either. - In the left column, a number of 1unit x 1unit blocks fixed down the column. Also some blank space at the top - again, not a problem. - In the right column: a number of free-floating blocks of standard unit-sizes which float around and fill the space given to them by the browser window. No problems here. - Lastly, a single element, 2 units wide, which sits half in the left column and half in the right column, and which the blocks in the right column still float around. Here be dragons. Please see here for a diagram: http://is.gd/bPUGI Problem: No matter how I approach this, it goes wrong. Below is code for my existing attempt at a solution. My current problem is that the 1x1 blocks on the right do not respect the 2x1 block, and as a result half of the 2x1 block is overwritten by a 1x1 block in the right-hand column. I'm aware that this is almost certainly an issue with position: absolute taking things out of flow. However, can't really find a way round that which doesn't just throw up another problem instead. Code: <html> <head> <title>wat</title> <style type="text/css"> body { background: #ccc; color: #000; padding: 0px 5px 5px 0px; margin: 0px; } #leftcol { width: 245px; margin-top: 490px; position: absolute; } #rightcol { left: 245px; position: absolute; } #bigblock { float: left; position: relative; margin-top: -240px; background: red; } .cblock { margin: 5px 0px 0px 5px; float: left; overflow: hidden; display: block; background: #fff; } .w1 { width: 240px; } .w2 { width: 485px; } .l1 { height: 240px; } </head> <body> <div class="cblock w2 l1" id="bigblock"> <h1>DRAGONS</h1> <p>Here be they</p> </div> <div id="leftcol"> <div class="cblock w1 l1"> <h1>Left 1</h1> <p>1x1 block</p> </div> </div> <div id="rightcol"> <div class="cblock w1 l1"> <h1>Right 1</h1> <p>1x1 block</p> </div> <div class="cblock w1 l1"> <h1>Right 2</h1> <p>1x1 block</p> </div> <div class="cblock w1 l1"> <h1>Right 3</h1> <p>1x1 block</p> </div> <div class="cblock w1 l1"> <h1>Right 4</h1> <p>1x1 block</p> </div> <div class="cblock w1 l1"> <h1>Right 5</h1> <p>1x1 block</p> </div> <div class="cblock w1 l1"> <h1>Right 6</h1> <p>1x1 block</p> </div> <div class="cblock w1 l1"> <h1>Right 7</h1> <p>1x1 block</p> </div> </div> </body> </html> Constraints: One final note that I need cross-browser compatibility, though I'm more than happy to enforce this with JS if necessary. That said, if a CSS-only solution exists, I'd be extremely happy. Thanks in advance!

    Read the article

  • Fancybox Auto Close, but remain user control

    - by justinw
    Hi, i've searched through the forum yet i can't find the solution. i'm refering to this thread to do the auto close function: http://groups.google.com/group/fancybox/browse_thread/thread/d09438b7... I did follow JFK's solution which works just right: 'onComplete': function() { $("#fancybox-wrap, #fancybox-overlay").delay(3000).fadeOut(); } if you don't want the user to close the box, then add modal=true The scenario is I would like the user to have the option to close the modal when they click on the [close] button or click anywhere on the overlay. I'm using the latest version of FB and jQuery on Rails. Here's my script: <script type="text/javascript"> jQuery(document).ready(function() { jQuery("#link_post").fancybox({ 'autoDimensions':false, 'width':380, 'height':50, 'title':'This message box will automatically close in 10 seconds.', 'titlePosition':'outside', 'onComplete': function() { jQuery("#fancybox-wrap, #fancybox- overlay").delay(10000).fadeOut(); } }); }); </script> However, when i clicked on the close button, the title and close button will fade away, but the FB's content and overlay are still there! it will only fade away after 10 seconds. So, my question is how to overwrite the 'onComplete' function if user clicks on the close button before it automatically closes?

    Read the article

  • ASP.NET MVC Html Helper Extensions and Rendering Their Required "include"s

    - by Jimbo
    I have build a custom Html Helper extension as follows: public static string DatePicker(this HtmlHelper helper, string name, string value) { return string.Format(@"<script type='text/javascript'> $(document).ready(function(){{ $('#{0}').datepicker({{ changeMonth: true, changeYear:true, dateFormat: 'd-M-yy', firstDay: 1, showButtonPanel: true, showWeek: true }}); }}); </script> <input type='text' name='{0}' id='{0}' value='{1}'>", name, value); } The problem is that this now requires the page to "include" the following: <script src="/Scripts/jquery-1.4.2.min.js" type="text/javascript"></script> <script src="/Scripts/jquery.ui.datepicker.min.js" type="text/javascript"></script> And a few other items. The questions are as follows: Is there a serious processing overhead if I were to include these items in EVERY page (like in the Site.Master for example) thus negating the need for the HtmlHelper to organise the "includes" - considering there would end up being about 20 includes for all the different types of jQuery UI widgets used throughout the site. If the HtmlHelper sorts out the "includes", it will add one every time this DatePicker is used (often there are two on a page) Does anyone have a way of determining whether or not the user has already rendered the same type of control on the page, thus not re-including the same jquery libraries when multiple instances of the DatePicker (for example) are used?

    Read the article

  • Graphviz DOT arrange Nodes in circles

    - by Ivo Wetzel
    OK here's my problem, I'm generating a graph of a python module, including all the files with their functions/methods/classes. I want to arrange it so, that nodes gather in circles around their parent nodes, currently everything is on one gargantuan horizontal row, which makes the thing 50k pixels wide and also let's the svg converter fail(only renders about the half of the graph). I went trough the docs(http://www.graphviz.org/doc/info/attrs.html) but couldn't find anything that seems to do the trick. So the question is: Is there a simple way to do this or do I have to layout the whole thing by myself? :/

    Read the article

  • Visualizing Undirected Graph That's Too Large for GraphViz?

    - by Gabe
    Hi Everyone, I was wondering if anyone has any advice for rendering an undirected graph with 178,000 nodes and 500,000 edges. I've tried Neato, Tulip, and Cytoscape. Neato doesn't even come remotely close, and Tulip and Cytoscape claim they can handle it but don't seem to be able to. (Tulip does nothing and Cytoscape claims to be working, and then just stops.) Does anyone have any ideas? I'd just like a vector format file (ps or pdf) with a remotely reasonable layout of the nodes. Thanks!

    Read the article

  • How can I debug why this click handler never fires?

    - by tixrus
    I am going to be excrutiatingly detailed here. I am using Firefox 3.6.3 on Max OSX with Firebug 1.5.3. I have two versions of a project, one which works and one with a bug. One I downloaded and one I typed by hand. Take a guess which one doesn't work. They should be the same except that mine uses a newer version of jQuery and the files are named differently. jQuery version is not the issue. I made mine use the older jquery and I made the working one use the newer jquery. Either way, mine still broke and the downloaded one still works. I've busted my eyes trying to see how these projects are different. The only thing I don't want to do is copy the working code to the busted code because I need to be able to figure this stuff out when it is my own unique code causing similar issues. There are no errors that I can see in Firebug in my code, in fact, 2/3 of it works just fine. just the second button does nothing. So I wanted to step through. These are always eyeball errors and I really suck at seeing them. I put it on a public server. http://colleenweb.com/jqtests/ex71.html And I want to debug ex71.js If you firebug the working one and set a break point at line 13 in ex71.js the variable json has the expected values when you click on the second button. But If you firebug this one, it never gets there. I've been over the html and all the names of everything seem to match up. I also wonder why the buttons aren't right justified but that's a css thing. Please tell me what I'm missing, and more importantly, what tool/technique I could use to find these types of bugs.

    Read the article

  • Web Page Design Get Distorted in Desktop PC Monitor

    - by Tarik
    I am building my web application on my laptop but when I navigate the page on my desktop pc the layout of the div are distorted. I think the solution is giving percentage instead of absolute numbers like 240px to height and width of divs. What do you think ? Do you have another recommendations ? Thanks in advance. What I've done is : <div style="height:240px;width:240px"></div> What I think I have to do is : <div style="height:100%;width:90%"></div>

    Read the article

  • How to hide check all, clear all checkbox

    - by Kalpana
    I am having check box in the column header. The function of this is to check or uncheck all the check boxes in that column.If the row check box is checked and say delete, that row can be deleted from the dataTable. If the row object is used in some other table as a foreign key i put '-' in that row instead of check box which indicates that row cannot be deletable. In these cases if all the row has '-" , there is no need to have the header check box. How to programatically hide this 'Check All | Clear All' check box, if there is nothing to be removed. It would be even preferable to hide the 'Remove' button if there is no selection to be made. What are the best practices to address the above scenario. I have attached the javascript which I am using. <script type="text/javascript"> var tableId = '#user\\:userList'; jQuery(document).ready(function() { jQuery('#selectAll').click(function() { jQuery(tableId).find("input[type='checkbox']").attr('checked', jQuery('#selectAll').is(':checked')); }); }); </script>

    Read the article

  • Problem with sizes of EditText and Button in Android

    - by DixieFlatline
    I want to make the edittext width the same size as button. My EditText is currently very small. I use relative layout. <TextView android:id="@+id/aha4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="17dip" android:text="Vzdevek:" android:layout_below="@id/aha3" /> <EditText android:id="@+id/nick" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_below="@id/nivo" android:layout_toRightOf="@id/aha4"/> <Button android:id="@+id/poslji" android:text="Pošlji" android:layout_height="wrap_content" android:layout_width="20dip" android:typeface="serif" android:textStyle="bold" android:layout_alignParentRight="true" android:layout_below="@id/nivo" android:layout_toRightOf="@id/nick"/> What i currently get is this: What is the appropriate layout_width for edittext and button?

    Read the article

  • Content display problems when using Suckerfish menus with 960.gs and IE

    - by Cedar Jensen
    I'm using 960.gs layout and when I add the suckerfish menu as part of the content to one of the grids, the contents of adjacent siblings bleed through the menu in all versions of IE. In the listed html below, the text from 'belowFoldSection' will appear through the menu when it is visible and has enough items to make it span over 2nd section. However, the contents of 'introSummary' will be underneath the menu, as expected. I've set the z-index for #nav and #nav ul in my css and this of course makes it work in FF, Chrome and Safari, but not in IE (because IE incorrectly assigns child elements its own z-index). If I change the .grid_nn class 'position' attribute (set by default in the 960 template) from 'relative' to absolute, this fixes it in IE. However, it is my understanding that I don't want the child elements of the 'container_12' to be taken out of the flow of the document and want them positioned relative to the .container_12's starting point. (Changing the attribute to absolute causes other general layout problems) Can anyone suggest a work-around? My html: <div class="container_12"> <!--First section where menu lives--> <div class="grid_12" id="mainSection"> <div class="grid_4 alpha" id="intro"> <p>Start of menu here</p> <div id="subMenu"> <ul id="nav"> <li><a href="#">Item 1</a> <ul> <li><a href="#">Burrowing gobies</a></li> <li><a href="#">Dartfishes</a></li> <li><a href="#">Eellike gobies</a></li> <!--10 more for longer list --> </ul> </li> <li><a href="#">Item 2</a> <ul> <li><a href="#">Remoras</a></li> <li><a href="#">Tilefishes</a></li> <!--10 more for longer list --> </ul> </li> <li><a href="#">Item 3</a> <ul> <li><a href="#">Climbing perches</a></li> <li><a href="#">Labyrinthfishes</a></li> <li><a href="#">Kissing gouramis</a></li> <!--10 more for longer list --> </ul> </li> </ul> <div id="introSummary"> <h1>PERCIFORMES! (1)</h1> <p>Welcome to the world of Perciformes - perch-like fish including the world famous <strong>Suckerfish</strong></p> </div> </div> <!-- end of sub menu --> </div> <div class="grid_8 omega" id="summary"> <p>Some stuff goes here</p </div> </div> <!-- End of first section --> <div class="clear">&nbsp;</div> <div class="grid_12 spacer"> </div> <div class="grid_4" id="belowFoldSection"> <p>Here is some stuff I want to appear below the menu when the pop-up is visible</p> </div> </div> <!-- container_12 --> The suckerfish css file: #nav, #nav ul { /* all lists */ padding: 0; margin: 0; list-style: none; line-height: 1; z-index: 99; } #nav a { display: block; width: 10em; } #nav li { /* all list items */ float: left; width: 10em; } #nav li ul { /* second-level lists */ position: absolute; background: orange; width: 10em; left: -999em; } #nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */ left: auto; } Default 960.gs css: .container_12, .container_16 { margin-left: auto; margin-right: auto; width: 960px; } .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .grid_13, .grid_14, .grid_15, .grid_16 { display: inline; float: left; position: relative; margin-left: 10px; margin-right: 10px; }

    Read the article

  • Getting browser to make an AJAX call ASAP, while page is still loading

    - by Chris
    I'm looking for tips on how to get the browser to kick off an AJAX call as soon as possible into processing a web page, ideally before the page is fully downloaded. Here's my approximate motivation: I have a web page that takes, say, 5 seconds to load. It calls a web service that takes, say, 10 seconds to load. If loading the page and calling the web service happened sequentially, the user would have to wait 15 seconds to see all the information. However, if I can get the web service call started before the 5 second page load is complete, then at least some of the work can happened in parallel. Ideally I'd like as much of the work to happen in parallel as possible. My initial theory was that I should place the AJAX-calling javascript as high up as possible in the web page HTML source (being mindful of putting it after the jquery.js include, because I'm making the call using jquery ajax). I'm also being mindful not to wrap the AJAX call in a jquery ready event handler. (I mention this because ready events are popular in a lot of jquery example code.) However, the AJAX call still doesn't seem to get kicked off as early as I'm hoping (at least as judged by the Google Chrome "Timeline" feature), so I'm wondering what other considerations apply. One thing that might potentially be detrimental is that the AJAX call is back to the same web server that's serving the original web page, so I might be in danger of hitting a browser limit on the # of HTTP connections back to that one machine? (The HTML page loads a number of images, css files, etc..)

    Read the article

< Previous Page | 427 428 429 430 431 432 433 434 435 436 437 438  | Next Page >