javascript - JQuery UI buttonset misbehaving -

-

i building ui app using jquery ui elements. need radio buttons part of functionality. while using jquery buttonset works, once try incorporate rest of ui elements don't align properly:

http://jsfiddle.net/seuns/2/

including code here:

$(document).ready(function() {     $("button").button();     $("#tdidir").buttonset();     $("#acqmode").buttonset(); });  <div id='primarylatestcontrol' class="ui-corner-top pacontainer" style='padding: 4px; display: inline-block; '>      <button id="setgain" class="button">set</button>     <span class="label">gain value</span>     <input type="text" id="gainvalue" class="value" value="2"></input>       <button id="setlinerate" class="button">set</button>     <span class="label">line rate, hz</span>     <input type="text" class="value" id="lineratevalue" value="3750"></input>       <button id="setexposetime" class="button">set</button>     <span class="label">exposure time(ms)</span>     <input type="text" class="value" id="exposetimevalue" value="100"></input>       <button id="settdi" class="button">set</button>     <span class="label">tdi direction</span>     <form>         <div id="tdidir">             <label class="checklabel" for="forward">forward</label>             <label class="checklabel" for="reverse">reverse</label>             <input type="radio" class="value" name="tdidir" id="forward" checked="checked"/>             <input type="radio" class="value " name="tdidir" id="reverse"/>             </div>     </form>      <button id="setacqmode" class="button">set</button>     <span class="label">acquisition mode</span>     <form>         <div id="acqmode">             <label class="checklabel" for="tdi">tdi</label>             <label class="checklabel " for="area">area</label>             <input type="radio" class="value" name="acqmode" id="tdi" checked="checked"/>             <input type="radio" class="value" name="acqmode" id="area"/>         </div>     </form> 

.pacontainer {     position: relative;     width: 80%; }  .label {     float: left;     margin: 10px; }  .checklabel {     width: 100px;     float: right;     margin: 10px; }  .endline {     clear: right; }  .button {     float: left;     margin-left: 10px;     clear: left; }  .value {     float: right;     width: 45px;     height: 20px;     margin: 5px;     background-image: none; }

i made changes code give idea. http://jsfiddle.net/seuns/3/

you want buttons in buttonset ordered because buttonset gives outer buttons round corners , inner buttons 'squished' margins close together. without right ordering, buttonset not right.

floating radio's labels cause radios unordered in buttonset. suggest floating radio's containers instead of labels. 

#acqmode, #tdidir {   float: right; }

and remove float on .checklabels no longer needed

.checklabel {     //float: right; }

you should keep radio's labels radio inputs. ordering issue buttonsets. 

<div id="acqmode">     <label class="checklabel " for="area">area</label>     <input type="radio" class="value" name="acqmode" id="area"/>     <label class="checklabel" for="tdi">tdi</label>     <input type="radio" class="value" name="acqmode" id="tdi" checked="checked"/> </div>

the last issue need has clearfix. buttonset larger text on same line, next line not straight without clearfix. jquery ui has helper class 

ui-helper-clearfix

i added class line above uneven. class goes on parent of last floated element. (try removing class idea of mean).


Comments

Post a Comment

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

-
using jmockit 1.2 jar, trying mock string's length method getting unexpected invocation exception: failed: test java.lang.illegalstateexception: missing invocation mocked type @ point; please make sure such invocations appear after declaration of suitable mock field or parameter @ stringdemo.testa$1.<init>(testa.java:17) @ stringdemo.testa.test(testa.java:13) i using testng: @test public void test() throws exception { new expectations() { @mocked("length") string astring; { astring.length(); result = 2; } }; system.out.println(a.showa("test")); } } actual class a: public class { public static int showa(string str){ int a= str.length(); return a; } } this wrong way of recording expected results. shouldn't mock , record string's length() method, record showa() instead. here solution @suppresswarnings("unused...
Read more

What is the difference between data design and data model(ERD) -

-
i have google question , find answer in day. know, data design many many table have list column,and mark pk , fk. why er-diagram have find this? data design process of designing database. main output of data design detailed logical data model of database. some people data design includes of needed logical , physical design choices , physical storage parameters needed generate design in data definition language. technically, database analysis, database analysts (dbas) trained do. while person can both data design , database analysis, these 2 different tasks. data design models data. database analysis takes model , applies 1 or more database engines (relational, hierarchical, nosql). a logical data model 1 of main outputs of data design. data model represented entity relationship diagram, or er diagram.
Read more

ios - Can NSManagedObject conform to NSCoding -

-
i need transfer single object across device. right converting nsmanagedobject dictionary , archiving , sending nsdata. upon receiving unarchiving it. transfer nsmanagedobject archiving , unarchiving instead of creating intermediate data object. @interface test : nsmanagedobject<nscoding> @property (nonatomic, retain) nsstring * title; @end @implementation test @dynamic title; - (id)initwithcoder:(nscoder *)coder { self = [super init]; if (self) { self.title = [coder decodeobjectforkey:@"title"]; //<crash } return self; } - (void)encodewithcoder:(nscoder *)coder { [coder encodeobject:self.title forkey:@"title"]; } @end nsdata *archivedobjects = [nskeyedarchiver archiveddatawithrootobject:testobj]; nsdata *objectsdata = archivedobjects; if ([objectsdata length] > 0) { nsarray *objects = [nskeyedunarchiver unarchiveobjectwithdata:objectsdata]; } the problem above code is. crashes @ self.title in initwithcoder sa...
Read more