backgroundimage

marbetschar - Coldfusion, Klettern, Freizeit

30Nov

jqTransform und selectedIndex Problematik

0

Verwendet man jqTransform um Formulare optisch aufzupeppen und manipuliert das Formular gleichzeitig mit JavaScript, stolpert man leider relativ schnell über die selectedIndex Problematik bei Select-Boxen.

Über das selectedIndex Attribut kann das zurzeit selektierte Element in der Select-Box programmatisch gesetzt werden. Leider übernimmt jqTransform diese Auswahl nicht - man muss also ein wenig Hand anlegen, damit das auch mit jqTransform korrekt funktioniert. Leider ein Bug der bereits seit längerem Bestand hat - ich muss mal bei den Jungs anklopfen damit sie den Fehler beheben :(

Nichts destotrotz hier der jQuery Schnipsel zur Bereinigung des Problems: 

el.prop('selectedIndex',0);
el.parent().find('ul > li > a').removeClass('selected');  //jqTransform hack
el.parent().find('ul > li > a:first').addClass('selected');  //jqTransform hack
el.parent().find('div > span').text(el.children(':selected').text());  //jqTransform hack

Webseite
Mehr lesen Kategorien: Webdevelopment
10Jan

accessibleTabs und TwitterWidget

2

Letzte Woche wollte ein Mitarbeiter von mir das jQuery Plugin accessibleTabs zusammen mit dem offiziellen TwitterWidget verwenden. Dabei hat er einen interessanten Effekt festgestellt: Die Webseite bleibt beim Seitenaufbau hängen.

Nach Rücksprache mit Dirk Ginader, dem Entwickler des Plugins, konnte das Problem schnell beseitigt werden. Die Lösung führt über die ‘id’ - Option des Twitter-Plugins. Wird diese fix vergeben, beissen sich beide JavaScript Codes nicht mehr.

JavaScript im HTML Head:

$(document).ready(function(){
    var twitterWidget = new TWTR.Widget({
    version: 2,
    id:'twitterWidget',  //Das ist die magische Zeile
    type: 'profile',
    rpp: 8,
    interval: 5000,
    width: 380,
    height: 250,
    theme: {
      shell: {
        background: '#d11e30',
        color: '#ffffff'
      },
      tweets: {
        background: '#ffffff',
        color: '#777777',
        links: '#d11e30'
      }
    },
    features: {
      scrollbar: true,
      loop: false,
      live: true,
      hashtags: true,
      timestamp: true,
      avatars: false,
      behavior: 'all'
    }
  }).render().setUser('netliveIT').start();

 $('.tabs').accessibleTabs({
    tabhead: 'h2',
    fx: 'fadeIn',
    fxspeed: 200
  });
});

HTML Code im Body Bereich:

<div class="tabs">
  <h2>Twitter</h2>
  <div class="tabbody" id="twitterWidget">
      follow us on <a href="http://twitter.com/netliveIT">twitter</a>
  </div>

  <h2>Tab2</h2>
  <div class="tabbody">
    <p>Tab Content</p>
  </div>

  <h2>Tab3</h2>
  <div class="tabbody">
    <p>Tab Content</p>
  </div>
</div>

Vielen Dank an dieser Stelle noch einmal für die schnelle und unkomplizierte Hilfe von Dirk!

Mehr lesen Kategorien: Webdevelopment
02Dez

mura: Content Search im öffentlichen Bereich

0

mura ist ein tolles open source cms auf basis von ColdFusion. Es lässt sich kinderleicht erweitern, bringt aber auch die wichtigsten Funktionen freihaus mit. Deshalb dachte ich mir, eine einfache Suche im Webauftritt muss doch ebenfalls mitgeliefert worden sein?!

Leider wurde ich im Netz aber nicht fündig. Ihr könnt euch denken warum: Die Lösung ist viel zu einfach. Deshalb hat sich niemand die Mühe gemacht um einen Blogeintrag zu erstellen: Es reicht, wenn man die index.cfm mit folgenden Parametern aufruft:

/index.cfm?display=search&amp;keywords=searchString

Natürlich benötigt man in der Regel ein Formular, aber auch das ist nicht allzu kompliziert. Ausserdem lassen sich der Suche weitere Parameter mitgeben: 

&lt;form id="searchForm" action="#cgi.script_name#"&gt;
   &lt;input type="hidden" name="display" value="search" /&gt;
   &lt;input type="hidden" name="newSearch" value="true" /&gt;
   &lt;input type="text" name="keywords" value="" /&gt;
   &lt;input type="submit" class="formbtn" value="Search" /&gt;
&lt;/form&gt;

Welche Parameter alle übergeben werden können, weiss ich noch nicht. Ich werde mir das noch einmal genauer anschauen.

Mehr lesen Kategorien: ColdFusion , Webdevelopment
12Apr

xPath Eltern Element

0

Ab und an kommt es vor, dass man über eine Xml Struktur stolpert deren xPath Abfrage das Eltern Element zurückliefern soll. Eigentlich eine simple Anforderung und die Lösung ist ebenso einfach, man denkt halt einfach nicht drann…

Ich gehe dabei von der folgenden Xml Struktur aus:

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;root&gt;
&lt;parent id="15"&gt;
&lt;datachild&gt;Diese Daten sind wichtig fuer mich&lt;/datachild&gt;
&lt;querychild flag="1" /&gt;
&lt;/parent&gt;
&lt;/root&gt;

Das xPath Query, welches mir alle Elemente mit gesetztem Flag Attribut zurückliefert ist schnell erstellt:

&lt;cfset myResult = xPath(myXml,"/root/parent/querychild[@flag='1']") /&gt;

Jetzt bin ich aber an den Daten im datachild - Node interessiert, das heisst ich benötige den kompletten parent - Node:

&lt;cfset myResult = xPath(myXml,"/root/parent/querychild[@flag='1']/..") /&gt;

Einfach eine “Verzeichnisebene” nach oben, so wie früher. Da kommt mir doch ein geeigneter Werbeslogan in den Sinn: Weil einfach einfach einfach ist.

Mehr lesen Kategorien: ColdFusion , Webdevelopment