^Vissza a lap tetejére
Contact Information
Telephone: +36 20 911 0504
e-mail:info@robitbt.hu

RoBIT számítástechnikai BT

Ügyviteli szoftverek, több mint 20 éve a piacon.

  • 1 Adatmágus-eszköz program

    Tárgyi eszköz és immateriális javak nyilvántartása, Értékcsökkenés számítás. Tárgyi eszközök, immateriális javak nyilvántartása, Számviteli törvény és adótörvény szerinti ÉCS. számítás, Érték növelés, érték vesztés, visszaírás, eladás, selejtezés. Maradvány érték kezelés Könyvelési feladás (lista és XML fájl), Nyilvántartási karton. Leltár lista Rendszer: Microsoft Windows 9x/ME/NT/2000/XP/VISTA/Windows7/Windows8
    Bővebben...
  • 2 Adatmágus-pénztár program

    Házipénztár kezelő program. Házipénztár nyilvántartás, időszaki pénztárjelentő, rovancs, kiadási/bevételi bizonylat nyomtatás Pénztár bizonylatok rögzítése, nyomtatása. Partner adatbázis kezelése, Integrálható a WSZAMLA számlázó programmal....
    Bővebben...
  • 3 Adatmágus-kontir könyvelő program

    Kettős könyvvitelt vezető KFT -k, betéti társaságok, társadalmi szervezetek és könyvelő irodák számára. 20 éve használják, a felgyülemlett felhasználói tapasztalatok alapján folyamatosan fejlesztett kiemelkedő minőségű szoftver. Napló lista, Könyvelési karton, Főkönyvi kivonat, Vevő-szállító analitika, ÁFA kimutatás(xx65 bontásában), ÁFA arányosítás Mérleg, ......
    Bővebben...
  • 4 Adatmágus-számla program

    Cikk adatbázis karbantartás, Vevő adatbázis karbantartás, Számla készítés, Testre szabható számla formátum, Többnyelvű számla formátum is kialakítható, "Csekkes" számla készítés lehetséges, LOGO megjelenítés lehetséges, Boriték nyomtatható, Integrálható a házipénztár kezelő programmal
    Bővebben...
  • 5 ROBIT BT

    Több mint 20 éve a piacon, több száz elégedett ügyfél. Szoftver fejlesztés egyedi igények szerint, univerzálisan használható kész kiforrott ügyviteli programok. Megbízható, kölcsönös előnyökre törekvő üzleti kapcsolat, korrekt árak.
    Bővebben...

Ez egy AJAX, php,mysql Jquery, jquery.ingrid, jquery.ui, jquery.ui.datapicker, jtree, jquery.currencyFormat -ra épülő biztonságos és kényelmesen használható GNU/GPL licenc szerint szabadon felhasználható Javascript – PHP keretrendszer.

speciális form mezők, form validátor

start demo

adat tábla (adat böngésző)

start demo

Fa struktúra

start demo

 

Tulajdonságok

  • AJAX kliens – szerver arhitektúra, MVC (adat model – viewer - controller) koncepció,

  • popupMsg, pupuFrame,popupYesNo, popupNoYes dialóg ablakok,

  • Dátum beviteli mező naptár poup -al,

  • Pénznem beviteli mező (ezres elválasztó, két tizedere kerekítés), 

  • Űrlap ellenőrzés (javascript alapú, AJAX szerver oldali adatlekéréssel kombinálható),

  • Fastruktúra megjelenítés AJAX szerver oldali adatlekéréssel,

  • Adat böngésző tábla AJAX szerver oldali lekéréssel,

  • Többnyelvű felület kialakítása előkészítve (jelenleg csak magyar változat van készen),

  • CSS fájlokkal image cserékkel testre szabható megjelenés,

  • Biztonságos védett rendszer (a Javascript forrás programokat illetéktelen nem tudja közvetlenül elérni, a böngészőbe egy tömörített nagyon nehezen olvasható visszafejthető JS kód kerül letöltésre, ebben a kényes adatok egyszer használatos algoritmussal kódolt formában szerepelnek. Az AJAX kommunikáció egy formonként képzett egyszer használatos egyedi kulccsal védett.

  • Továbbá rendelkezésre állnak a Jquery, jquery.ui alap szolgáltatásai is.

 

Licensz

Ez a szoftver és annak dokumentációja a GNU/GPL licenc szerint ingyenesen és szabadon felhasználható, másolható, továbbfejleszthető.

A GNU/GPL licenc magyar fordítása:

A GNU/GPL licenc jogilag hiteles eredeti angol nyelvű változata:

http://www.gnu.org/licenses/gpl.html

Felhasznált külső fejlesztésű erőforrások:

Jquery v1.7.2 http://jquery.com

Jquery.ui v1.8.21 http://jqueryui.com/about

Jjquery.ui.datapicker v1.8.21 http://jqueryui.com/about

jquery.formatCurrency http://www.gnu.org/licenses/

dTree 2.05 http://www.destroydrop.com/javascript/tree/

jquery.ingrid 0.9.3 kis mértékben átdolgozva, fejlesztve

     http://www.reconstrukt.com http://slu.sh

php http://www.php.net

mysql http://www.mysql.com

Köszönet a fejlesztőknek!

A felhasznált külső erőforrások licenszeit lásd a fejlesztők honlapjain!

Szerző

Fogler Tibor  Ez az e-mail cím a spamrobotok elleni védelem alatt áll. Megtekintéséhez engedélyeznie kell a JavaScript használatát. 

WEB oldal: adatmagus.hu

Támogatás:

A felhasználói kérdéseket elsősorban ezen az oldalon a "Hozzászolások" részen várjuk és válaszoljuk meg, így a tapasztalatok válaszok egyuttal "közkinccsé" is válnak. Kérjük, hogy csak nagyon indokolt esetben irjon privát e-mail -t a  Ez az e-mail cím a spamrobotok elleni védelem alatt áll. Megtekintéséhez engedélyeznie kell a JavaScript használatát.  címre.

 

Ponzorálás:

Hálásan megköszönöm amennyiben bármilyen csekély összeggel támogatni tudja a további GNU/GPL licenszű szabadszoftverek fejlesztésére irányuló munkámat. Ebben az esetben utalja át a támogatást a


Ez az e-mail cím a spamrobotok elleni védelem alatt áll. Megtekintéséhez engedélyeznie kell a JavaScript használatát.  paypal

fiókba és erről e-mail-ben is tjékoztasson!

A működés áttekintése

Szerver oldali könyvtár szerkezet:

 server_document_root/lib    a  keretrendszer JS és php fájljai
                     /css    a  keretrendszer stilus fájljai és
                             iamges könyvtárai
                     /projektName a projekt html és js.php fájljai
                     /projektName/models  a projekt adatmodeljei és
                                          a konfiguráció beállítás                                       
                                          (php fájlok)
        

Minden képernyőhöz minimum két fájl tartozik:

  1. Javascript kód. Biztonsági okokból xxxxxxx.js.php fájlokban van tárolva (lásd lentebb), a Jquery koncepciónak megfelelően elkészítve.

  2. html dokumentum. Ez egy komplett html dokumentum, tartalmazza a html headert, benne a stilus linkeket és a lib/xxxxxx.js javascript behivásokat is, valamint a képernyöhöz tartozó xxxxxx.js.php behívását.. A Jquery koncepciónak megfelelően ebben közvetlen JS kodok használata erősen ellenjavalt.

    Mindkét fájl a 'projektName/' könyvtárban található.

    A xxxx.js.php fájlok php includdal és egy kötelező php sorral egy „preprocesszort” futtatnak, ami a javascript kódot tömörítve és a legkényesebb adatokat egyszer használatos algoritmussal titkosítva küldi ki a böngészőnek. Továbbá egy formonként egyedileg képzett biztonsági kódot is elhelyez a javascript -ben amit az AJAX szerver hívásoknál ellenőrzésre használunk, ezzel is csökkentve az illetéktelen hozzáférések lehetőségét.

Amennyiben a form AJAX adatlekéréseket, adatmanipulációkat is végez akkor „adatmodell” is tartozik hozzá (egy adatmodelt több form is használhat). Az adatmodell php fájl a 'projekctName/models' könyvtárban. Ez egy 'dataModel' nevü osztályt definiál aminek különböző methodusai lehetnek amik az egyes adat lekérő, adat manipulációs akciókat szolgálják ki.

Az alábbi ábrán mindezt egy példa szemlélteti. A példában azt tételezem fel, hogy a program első képernyője (ami a projectName/index.html) a bejelentkező formot tartalmazza.

Programozói dokumentáció

A programokat Javascript és PHP nyelven írjuk. A javascript programokat a Jquery keretrendszer koncepciója szerint alakítjuk ki.

Értelemszerüen használható minden JQuery API funkció és minden JQuery.UI function

>

Általános konvenciók

Egy óldal képi megjelenését tartalmazó valami.html fájl:

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ingrid. the jQuery Datagrid</title>
….....
<link type="text/css" href="/jm/../css/ui-lightness/jquery-ui-custom.css" rel="stylesheet" />
<link rel="StyleSheet" href="/jm/../css/amform.css" type="text/css" />
<script type="text/javascript" src="/jm/../lib/jquery.min.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.cookie.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.ui.custom.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.amform.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.amform-hu.js"></script>
<!--- szükség szerint elhagyható elemek -->
<script type="text/javascript" src="/jm/../lib/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.ui.datepicker-hu.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.formatCurrency.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.formatCurrency.hu-HU.js"></script>
<script type="text/javascript" src="/jm/../lib/jquery.ingrid.js">
</script><script type="text/javascript" src="/jm/../lib/jquery.ingrid-hu.js"></script>
<link rel="StyleSheet" href="/jm/../css/ingrid.css" type="text/css" />
<script type=”text/javascript” src=”lib/jquery.tree.js”></script>
<link rel="StyleSheet" href="/jm/../css/dtree.css" type="text/css" />

<!-- kötelezö, fontos elem -->

script type="text/javascript" src="/jm/valami.js.php"></script>
</head>
<body> 
…......
</body>
</html>

Az oldalhoz tartozó Javascript kódot tartalmazó valami.js.php fájl:

<? php include '../lib/js.php'; ?> 
$( document).ready( 
     function() { 
…........
});
<? php jsOut(); ?> 

Adatmodel készítés, adat lekérés, adat manipuláció AJAX -al

A 'projectName/models' könyvtárba készitsünk egy config.php fájlt:

<? php
class amConfig {
  // if true send mysql errormsg into browser,
  // if false send only mysql errorNum and 'SQL ERROR' string
  var $resultSQLerrorMsg = false;
  // if true save sql into model\lastsql.sql file for 
  // development error find 
  var $saveSQL = false;
  // mysql connect info
  var $mysqlhost = 'localhost';
  var $mysqluser = 'yourMYSQLuserName';
  var $mysqlpassword = 'yourMYSQLpassword';
  var $mysqldatabase = 'yourMYSQLdtabaseName';
  var $prefix = '';
  ?>

Ugyanide készitsük el az adatmodelname.php fájlt vagy fájlokat:

<? php 
/*   adatmagus ajax data model */
global $records, $totalRecords, $errorNum, $errorMsg, $config;
include 'config.php';
$config = new amConfig();
mysql_connect($config->mysqlhost,$config->mysqluser,
    $config->mysqlpassword);
mysql_query('set names utf8');
mysql_select_db($config->mysqldatabase);
class dataModel {
   public function actionName1() { ….} 
   public function actionName2() { ….} 
   …....
}
?>

Az adatmodell methodusainak a $records globális változóba egy tömböt kell elhelyezniük, ahol a tömb elemei egy-egy rekordnak felelnek meg. Mindegyik tömb elem egy objektum ami „fieldname'=fieldValue propertyket tartalmaz.

JSON szintaxis szerint:

[{'fieldname':'fieldValue', 'fieldname':'fieldValue'....},

{'fieldname':'fieldValue', 'fieldname':'fieldValue'....}

…......

]

Az ingrid hivások POST paraméterben a következő adatokat küldhetik:

filter sql feltétel string urlencoded formában

sort rendezés, oszlopszám (a bal szélső oszlop száma:0

dir rendezési irány 'asc' vagy 'desc'

pagesize több lapos megjelenés esetén a jelenleg kért sorok száma

page több lapos megjelenés esetén az aktuális lapszám az első lap : 1

a (page-1)*pagesize sorral kell kezdeni a lekérést

Ezen adatok elérésére a Request('name') hívás is használható.

$totalRecords globális változóban a 'pagesize' és 'page' adatot figyelmen kívül hagyva, de a 'filtert' figyelembe véve lekérdezett összes rekordszámot kell elhelyezni.

$errorNum és $errorMsg globális változókba értelemszerűen a MYSQL hívás esetleges hibajelzéseit kell elhelyezni.

Lásd a dem_ingrid/konferenciak.php példát.

Adatmanipuláló sql futtatása a Javascript kódban:

$.ajax({'url':'..\lib\remote.php', 
  'type':'POST', 
  'data':{'model':@”..\projektName\modelName.php”@, 
        'action':@”actionName”@, 
        'paramName'.'paramValue'), 
         …...
       },
  'success':function() { …......} 
);

HTML include

A body részben használhatunk includeokat is:

<div class="include includeFileURL"></div>

modal popup dialogus ablakok

Egyszerü üzenet ablak „Rendben gombbal”

popupMsg(title,msgHtml);

Másik html oldal behívása modal popup dobouban

popupFrame(title,url,x,y,w,h);

Igen-nem kérdés, az Igen az alapértelmezett válasz

popupYesNo(title,msgHtl, 
    function() {yes click esemény kezelő },
    function() {no click esemény kezelő });

Igen-nem kérdés, a Nem az alapértelmezett válasz

popupNoYes(title,msgHtml,
    function() {yes click esemény kezelő },
    function() {no click esemény kezelő });


Üzenet ablak definiált gombokkal és funkciókkal,az első az alapértelmezett

popupMsg(title,msgHtml, {
  'gombFelirat':function() { gombClick eseménykezelő },
  'gombFelirat':function() { gombClick eseménykezelő }, ........
});

 

Speciális űrlap mezők

Dátum típusú ürlap mező:

Mindössze a HTML fájlban a class=”date” jelzést kell az input -tagbe beilleszteni.

Pénznem típusú ürlap mező:

Mindössze a HTML fájlban a class=”currency” jelzést kell az input -tagbe beilleszteni.

A nmező aktuális értékének lekérésére a $(#id).asNumber() szintaxis használandó.

Űrlap ellenőrzés, feldolgozás

A javascript kódban:

  1. inicializálni kell a validátor rendszert
    $(#formId).formInit();
  2. definiálni kell a mező ellenörző függvényeket
    $(#formId).setValidator(fieldId, function() {….})
    Az ellenörző függvények a
    $(#fieldId).setValid(fieldId, valid_status, validMsg)
    hívással kell az ellenőrzés eredményét visszaadnia. valid_status lehet:
    VALID_ERROR
    VALID_WARNING
    VALID_OK

    Az ellenorzó függvények szinkron vagy aszinkron AJAX hívásokat is tartalmazhatnak, ez esetben az AJAX 'success' eljárásban kell a 
    $(#formid).setValid(fieldid,valid_status,hibaüzenet); 
    hívást elhelyezni.

    NAGYON FONTOS! A setValid hívás minden ellenorzó függvényben kerüljön végrehajtásra akár jó az adat akár nem!

  3. A form „ Rendben ” gombjának működése:
    $("#formOK").button();
    $("#formOK").click(
         function() {    
             $('#formId').validator();
         }
    );  
      
  4. A form sikeres ellenörzés után aktivizálodó feldolgozó eljárása:

    $('# formId').setOKfunction( 
       function() {
          …..........
       }
    ); 
      

    Lásd amform_demo.js.php

Fa struktúra megjelenítés

A HTML kódban helyezzünk el egy „konténer” DIV elemet, ahová a fa szerkezet kerülni fog.

A Javascript kódban:

   $('# konténerId').tree({
     'ajax':true,     
     'model':@"../tree_demo/models/treedata.php"@,     
     'action':@"getTreeData"@,
     'nodeClick':function(id) {
         alert('document click '+id);
     },     
     'loadFun':function(result) {}
   }); 

Lásd tree_demo/tree_demo.js.php

Adatböngésző táblázat megjelenítése

A HTML kódban helyezzünk el egy „konténer” TABLE elemet, ahová az adattábla kerülni fog.

thead részben alakítsuk ki a táblázat fejlécet. A tbody lehet üres is, de feltétlenül létezzen!.

A Javascript kódban:

var mygrid1 =
$("#table1").ingrid({ 
        url: '../lib/remote.php',
    type:'POST',
    dataType:'json',
      height: 350,
    savedStateLoad: true,
    totalRecords:10,  //it is must! 
    recordsPerPage:10,
    sortedCol:0,
        extraParams:{
      'model':@"../ingrid_demo/models/konferenciak.php"@,        
      ' action':@"getRecords_table1"@,
      'pagesize':10,
      'skey':skey
    },
    onRowSelect: function(tr, selected){              
     $('tr.grid-row-even').removeClass('grid-selected');              
     $('tr.grid-row-add').removeClass('grid-selected');
     var str = selected ? 'SELECTED' : 'UNSELECTED';
     var tr_html = $(tr).html();
     $(tr).addClass('grid-selected'); 
     popupMsg('row click',str + '<code>' + tr_html + '</code>');
    } 
});
$( window).unload(     
  function() {
    $.ajax({url:'../lib/remote.php', 
            data:{'model':@"../ingrid_demo/models/konferenciak.php"@'},
                  'action':@"close_getRecords"@}    
            );
           }
    );
);    

lásd ingrid_demo/ingrid_demo.js.php

Biztonsági megfontolások

Mivel a JavaScript kód letöltődik a böngészőbe és ott illetéktelenek is hozzáférhetnek minimalizálni kell a JavaScript kódban lévő kényes adatok mennyiségét, továbbá meg kell akadályozni, hogy aaz AJAX szerver funkciókat illetéktelenek hívhassák.

Ennek érdekében ez a rendszer többszintű védelmet tartalmaz:

  1. A böngészőkbe beépített alap AJAX védelmi rendszer megakadályozza, hogy AJAX hívásokat harmadik gépről küldjenek.

  2. Ha esetleg ezt a védelmet valaki át tudja lépni akkor a rendszer saját védelmi rendszerébe ütközik. Ugyanis a Javascript preprocesszor minden letöltésekor generál egy egyedi kódot, amit SESSION-ban is tárol és kiküld a böngészőbe is. Az ajax szerverek csak akkor szolgálják ki a kérést ha ez a kód is érkezik a kéréssel. Továbbá a rendszer ellenőrzi, hogy a kérés AJAX által generált kérés-e?

  3. A javascript preprocesszor a javascript kódban az 'adatmodel' neveket és 'action' neveket SESSIONban tárolja egy-egy minden alkalommal egyedileg képzett névhez rendelve, és a böngészőbe ezeket a session változó neveket küldi el. Így a kliens oldalon ezen adatok nem ismerhetőek meg, nem fejthetőek vissza.

  4. A fejlesztők egyéb kényes adatainál is használhatja ezt a titkosítási eljárást.
    A javascript forrás programba ezeket kényes adatokat @”xxxxxxxx”@ formában helyezzék el.
    A preprocesszor ezeket „SAFE_#########” kóddal fogja helyettesíteni és ezen a néven SESSION -ban tárolja. Ezután a fejlesztő által írt adatmodel php program feladata a név alapján az adat kiolvasása a session változóból, és használat után a session változó törlése.

  5. Így ha esetleg egy hacker minden védelmi rendszert kijátszva mégis aktivizálni tudna egy AJAX hívást, akkor sem tudja a kényes adatokat (pld. adat model név és akció kód) megadni mivel az egyszer használatos session nevet és a hozzá tartozó session változót a szerver gépen nem tudja előállítani.

Megjelenés testreszabása

Az oldalak megjelenése a „css” könyvtárban lévő css fájlok javításával és az ez alatt lévő

'xxxxxxx_img' könyvtárakban lévő képfájlok cseréjével módosítható.

Más nyelvű változat kialakítása

A l'ib' könyvtárban lévő 'xxxxxxxxx-hu.js' illetve 'xxxxxxxxx.hu-HU.js' fájlok lemásolásával és módosításával oldható meg. Természetesen ennek megfelelően módosítani kell a HTML oldalak head részét is.

Budapest 2012.08.01

Fogler Tibor

Facebook Twitter Google Bookmarks RSS Feed 

COPYRIGT Dizájn: CONSULTING SERVICESS FREE JOOMLA TEMPLATES