, ,

SyntaxHighlighter 3.0.83

Den SyntaxHighlighter gibt es seit ein paar Tagen in der neuen Version, die ich natürlich auch gleich einbauen musste 😉

Link verboten II

Eine andere Möglichkeit einen bestimmten Inhalt eines Links zu verbieten ist folgende Funktion.

	function isLinkOK(url) {
		var myValues = "ID=,public";	// Darf nicht vorkommen
		var myValueSplit = myValues.split(',');
		var myResult = true;
		var mySearch = "";
			
	  for(i = 0; i < myValueSplit.length; i++) {
      mySearch = new RegExp(myValueSplit[i],'i');
      if (url.search(mySearch) > -1) {
        myResult = false;
        break;
      }
    } 
    // alert(myResult);
  }

Aufgerufen werden kann die Funktion dann so:

Check the Link

Link verboten

Um nur Links zu erlauben die auf „.cfm“ enden, bin ich über die pop()-Funktion von Javascript gestolpert. im Formular rufe ich sie dann per onsubmit=““ auf und je nach dem kann dann das Formular abgeschickt werden oder nicht.

function isValidURL(url) {
  var isOK = url.split(/[.]+/).pop() == 'cfm';
  if (isOK == false) document.getElementById('msg').innerHTML = 'Ziel-Link ungültig!';
  return isOK;
}

Werte zwei Selectboxen tauschen

Ich weiss schon gar nicht mehr wie oft ich sowas selbst gemacht habe und/oder ehemalige Mitarbeiter damit belästigt habe.

Hier ein Beispiel was ich im Netz gefunden haben und auf Anhieb funktionierte. Cool!


Beim Aufruf wird dann der jeweilige Name der Selectbox (availableContacts) übergeben


bzw. auch


,

LinkClick im IE

Manchmal ist es notwendig ein Formular zu submitten und gleichzeitig eine eMail auszulösen, die der User noch bearbeiten möchte. Das heisst man muss das per Javascript machen. Entweder direkt


oder aus Gründen der Zeichensätzen über einen einfachen Link. Bei einem Link ist es natürlich notwendig, dann diesen Link per Javascript zu klicken.



Dazu soll der Text des Linkes, den man ja normalerweise zum anklicken benötigt, leer bleiben, damit man eben nicht einfach so anklicken kann. Logisch?

, ,

ColdFusion 9 – ExtJS

ColdFusion hat ja in seiner aktuellen (BETA-)Version 9, das ExtJS in der flammneuen Version 3 eingebaut. Das ist aber so miserable implementiert worden, das es wirklich unbrauchbar ist. Ich hoffe mal das liegt an der BETA-Version und wird im ersten Release-Candidat behoben sein. Eine entsprechende Fehlermeldung mit ScreenShot etc. habe ich den Jungs von Adobe schon vor einiger Zeit geschickt.

Im Moment scheint die einzige sinnvolle ExtJS-Enbindung das ColdExt zu sein. Oder eben man macht es wieder zu Fuss, pur ExtJS 🙁

ExtJS – Beispiel (3)

In meinen dritten Beispiel habe ich erst noch mal auf das JSon verzichtet, wohl um zu sehen wie schwierig es ist ohne ;-(

Der folgenden Javascript-Datei beispiel_3.js (der alten beispiel_2.js) habe ich lediglich eine ID pro Feld gegeben, um die Felder direkt ansprechen zu können; der Rest ist gleich geblieben:

Ext.onReady(function(){
  var beispiel_3 = new Ext.FormPanel({
    labelAlign:'left',
    frame:true,
    title:'Mein zweites Beispiel',
    bodyStyle:'padding:5px 5px 0',
    width:650,
    items:[{
      layout:'column',
      items:[{
      columnWidth:.5,
      layout:'form',
      items: [{
        xtype:'textfield',
        id:'vorname',
        fieldLabel:'Vorname',
        name:'vorname',
        anchor:'95%',
        value: 'Reinhard'
        }, {
        xtype:'textfield',
        id:'homepage',
        fieldLabel:'Homepage',
        allowBlank:true,
        name:'homepage',
        anchor:'95%',
        value: 'http://www.landstrasse.ch'
        }]
      },{
      columnWidth:.5,
      layout:'form',
        items:[{
          xtype:'textfield',
          id:'nachname',
          fieldLabel:'Nachname',
          name:'nachname',
          anchor:'95%',
          value: 'Jung'
          },{
          xtype:'textfield',
          id:'email',
          fieldLabel:'eMail',
          name:'email',
          vtype:'email',
          anchor:'95%',
          value: 'extjs@landstrasse.ch'
        }]
      }]
      },{
      xtype:'htmleditor',
      id:'beschrieb',
      fieldLabel:'Beschrieb',
      height:100,
      anchor:'98%',
      value: 'Na sowas?'
    }],
    buttons:[{text:'sichern'},{text:'abbrechen'}]
  });
  beispiel_3.render(document.body);
});

Hinzugekommen ist folgende Datei beispiel_3.cfc





  

  
  
  
  
  
  
  
  

  



Und die Datei beispiel_3.cfm bzw. ehemalige beispiel_2.html wurde wie folgt erweitert:




  
  Beispiel 3 - [ExtJS]
  
  
  

  
  
  
  

  
  
  
    
  

  





PS: Das Doppel-O bei onload (oonload) ist Absicht, da sonst die Anzeige als SourceCode nivht funktioniert.

ExtJS – Beispiel (2)

Im zweiten Beispiel versuche ich erst mal ein Formular mit statischen Daten anzuzeigen.

Die Werte werden per VALUE-Attibute gesetzt und sollten später mal aus einer Query kommen. Da spuckt mir aber ColdFusions serializeJSON()-Funktion (ab der ColdFusion-Version 8) in die Suppe, weil es eine andere Stucktur hat. Das cfJSON möchte ich aber nicht verwenden.

In der ersten Datei beispiel_2.html werden die notwendigen ExtJS-Dateien wie gehabt eingebunden und das ExtJS-Element diesmal direkt per render()-Funktion im BODY-Bereich dynamisch erstellt. Deshalb kann der HTML-BODY-Bereich einfach leer bleiben:




  
  Beispiel 2 - [ExtJS]
  
  
  

  
  
  
  






Die zweite Datei beispiel_2.js ist dann das Javascript, welches die gewünschten ExtJS-Elemente generiert.

Ext.onReady(function(){
  var beispiel_2 = new Ext.FormPanel({
    labelAlign:'left',
    frame:true,
    title:'Mein zweites Beispiel',
    bodyStyle:'padding:5px 5px 0',
    width:650,
    items:[{
      layout:'column',
      items:[{
      columnWidth:.5,
      layout:'form',
      items: [{
        xtype:'textfield',
        fieldLabel:'Vorname',
        name:'vorname',
        anchor:'95%',
        value: 'Reinhard'
        }, {
        xtype:'textfield',
        fieldLabel:'Homepage',
        allowBlank:true,
        name:'homepage',
        anchor:'95%',
        value: 'http://www.landstrasse.ch'
        }]
      },{
      columnWidth:.5,
      layout:'form',
        items:[{
          xtype:'textfield',
          fieldLabel:'Nachname',
          name:'nachname',
          anchor:'95%',
          value: 'Jung'
          },{
          xtype:'textfield',
          fieldLabel:'eMail',
          name:'email',
          vtype:'email',
          anchor:'95%',
          value: 'extjs@landstrasse.ch'
        }]
      }]
      },{
      xtype:'htmleditor',
      id:'beschrieb',
      fieldLabel:'Beschrieb',
      height:100,
      anchor:'98%',
      value: 'Na sowas?'
    }],
    buttons:[{text:'sichern'},{text:'abbrechen'}]
  });
  beispiel_2.render(document.body);
});
,

ExtJS – Beispiel (1)

So langsam habe ich Lust mich um das ExtJS zu kümmern, vor allem weil ich es auch als Admininterface für mein QuickBlog haben möchte.

Hierzu möchte ich mir ein paar Tutorials erstellen, um mich jederzeit wieder einfach reinzufinden. Evtl. ist ja das eine oder andere für euch an brauchbarem Material dabei. Meine Erkenntisse und erstes Beispiel zum Thema ExtJS habe ich aus Büchern und Blogs wie Cutter’s Crossing und dem all-time-favorit Ray Camden.

In der ersten Datei beispiel_1.html werden die notwendigen ExtJS-Dateien eingebunden und das DIV zur Anzeige des ExtJS-Elementes festgelegt:




  
  Beispiel 1 - [ExtJS]
  
  
  

  
  
  
  




Die zweite Datei beispiel_1.js ist das Javascript, welches das ExtJS-Element generiert und per URL-Paramater die Daten einliest.

Ext.onReady(function(){
  var beispiel_1 = new Ext.Panel({
    applyTo:'myDiv',
    title:'Mein erstes Beispiel',
    width:200,
    height:100,
    frame:true,
    autoLoad:{
      url:'beispiel_1.data'
    }
  });
});

Die dritte Datei beispiel_1.data enthält lediglich die Daten selbst, in Form von gewöhnlichem HTML:

Reinhard Jung: Landstrasse

IMG onError

Vom Michael habe ich den Tipp des onError bei einer Grafik bekommen und gleich mal einen kleinen Test geschrieben. Coole Sache. Danke schön.