Bootstrap Egutegia JQueryrekin

bootstrap-calendar Gero eta gehiago harritzen gaitu inguruan dabilen komunitate izugarriak Bootstrap, CSS esparru ezaguna , Twitterrek sortua. Oraingoan Bootstrap-en oinarritutako egutegia aurkezten dizuet Javascript eta JQuery-rekin programatutaEgutegiaren funtzionamenduaren zati bat ere zehatz-mehatz azalduko dut eta egin ditzakezun trikimailuak eta hobekuntzak gehituko ditut.

Bootstrap egutegi honek diseinu garbia du eta guztiz da sentikorrena, itxura ona izango du gailu guztietatik! A ere sartzen du itzulpena 7 hizkuntza baino gehiagora eta guzti herrialde bakoitzeko jai datak nabarmendu eta adierazi egiten dira. Luxu bat!

Bootstrap Calendar honen funtzionamendua konplexu samarra da, erabiltzailearen datak JSON fitxategi batetik ateratzen ditu hasiera batean, baina Creativos Online erabiltzaileentzako soilik, nola azalduko dut atera gertaerak MYSQL datu base batetik edozein sistematan ezin hobeto ezartzeko.

Datu base sistema ezaguna

Datu base sistema ezaguna

Aplikazioaren fitxategi nagusien funtzioak:

AURKIBIDEA.HTML

  • Bootstrap 2.3.2 kargatzen
  • Egutegiaren diseinua
  • Gertaeren zerrenda
  • Egutegian nabigatzen
  • Egutegiaren ikuspegi desberdinak (eguna / astea / hilabetea / urtea)
  • Aplikazioa JS-n kargatzen
  • Hizkuntza hautatzea

AURKIBIDEA-BS3.HTML

  • Bootstrap 3.0 kargatzen
  • Egutegiaren diseinua
  • Ekitaldi zerrenda
  • Egutegian nabigatzen
  • Egutegiaren ikuspegi desberdinak (eguna / astea / hilabetea / urtea)
  • Aplikazioa JS-n kargatzen
  • Hizkuntza hautatzea

EVENTS.JSON.PHP

  • Datu hauek dituzten Gertaeren zerrenda:
    • id: gertaeraren identifikatzailea
    • Izenburua: gertaeraren izenburua
    • url: gertaeraren URLa
    • klasea: gertaera mota (informazioa | abisua |…) ondorengo koloreetarako.
    • hasteko: hasiera data
    • amaiera: baja data

APP.JS

  • Aplikazioaren konfigurazioa gordetzen duten aldagaiak.
  • JQuery funtzio gehigarriak

EGUTEGIA.JS

  • Aplikazioen ezarpen nagusiak
  • Egutegiaren funtzio nagusiak
  • Gertaeren erauzketa eta tratamendua
  • Jai egunak
  • Hizkuntza kargatzen
  • Gertaeren zerrenda kargatzen
  • Egutegiaren ikuspegi desberdinak kargatzen (eguna / astea / hilabetea / urtea)

EGUTEGIA.CSS

  • Egutegi estiloak
  • Gertaeren zerrendako estiloak
  • Egutegi estiloak beste gailuetarako

Atera gertaerak datu-base batetik

Gertaerak MYSQL datu base batetik ateratzeko fitxategiaren lerroak ordezkatuko ditugu gertaerak.json.php arabera:

<?php

$link=mysql_connect("localhost", "usuariodeacceso", "contraseñadeacceso");
mysql_select_db("basededatos",$link) OR DIE ("Error: No es posible establecer la conexión");
mysql_set_charset('utf8');

$eventos=mysql_query("SELECT * FROM events'",$link);

while($all = mysql_fetch_assoc($eventos)){
$e = array();
$e['id'] = $all['id'];
$e['start'] = $all['inicio'];
$e['end'] = $all['final'];
$e['title'] = $all['nombre'];
$e['class'] = $all['clase'];
$e['url'] = $all['url'];
$result[] = $e;
}

echo json_encode(array('success' => 1, 'result' => $result));

?>

Github | Bootstrap Egutegia

Deskargatu | Bootstrap Egutegia

Informazio gehiago | Bootstrap: CSS Framework


Artikuluaren edukia gure printzipioekin bat dator etika editoriala. Akats baten berri emateko egin klik hemen.

14 iruzkin, utzi zurea

Utzi zure iruzkina

Zure helbide elektronikoa ez da argitaratuko. Beharrezko eremuak markatuta daude *

*

*

  1. Datuen arduraduna: Miguel Ángel Gatón
  2. Datuen xedea: SPAM kontrolatzea, iruzkinen kudeaketa.
  3. Legitimazioa: Zure baimena
  4. Datuen komunikazioa: datuak ez zaizkie hirugarrenei jakinaraziko legezko betebeharrez izan ezik.
  5. Datuak biltegiratzea: Occentus Networks-ek (EB) ostatatutako datu-basea
  6. Eskubideak: Edonoiz zure informazioa mugatu, berreskuratu eta ezabatu dezakezu.

  1.   David Z esan zuen

    Sergio kodea egiaztatzen dudanean

    1.    Sergio Rodenas esan zuen

      Kodea dagoeneko egiaztatuta dago! Gauza bakarra, zure datu basean «gertaerak» taula sortu behar dituzu eremu hauekin: {id | etxea | amaiera | izena | klasea | url} eta konfiguratu zure datu-baserako sarbidea!

      1.    Rose esan zuen

        Aldagai horiek beste batzuengatik aldatu ditut, eta gertaera nire datu basean gehitzeko aukera eman dit, baina ez dut egutegian islatzen ikusten. Eta nola berreskura ditzaket gertaeren datuak egutegian klik egiten dudan egunaren arabera?

  2.   Jose Luis Zamudio (@JoseZami) esan zuen

    Gertaeren sorrera egin eta burutzeko, orduan datu-base bat sortu behar duzu, baina zer da kontua da gertaerak erants diezazkioketela eta lehenetsi gisa hizkuntza gaztelania da lehenetsita ingeles gisa definitzen delako

    1.    Sergio Rodenas esan zuen

      Hizkuntza gaztelania lehenesteko, onena gaztelania fitxategian dauden kateak ingelesez calendar.js fitxategian ordezkatzea da. Hala ere, badira beste metodo txukunagoak, gidoiaren webgune nagusian edo Github komunitatean aurki ditzakezu, mezu honi atxikita.
      Gainera, aste batzuk barru mezu berri bat igotzen saiatuko naiz eta bertan datu basean gertaeren txertaketa nola sortu azalduko dut.

  3.   Jose Luis Zamudio (@JoseZami) esan zuen

    Mila esker, gertaerak txertatzeko mezua eskertuko dut :)

  4.   Jair esan zuen

    kaixo arazo bat daukat konektatzeko dena konpontzen dudanean eta datu basea datuetatik ateratzeak ez dit gertaerarik erakusten

  5.   diego esan zuen

    ez du gertaera datu basean txertatzen

  6.   Gonza esan zuen

    Argitaratu al dezakezu gertaerak nola txertatu? hasierako eta amaierako eremuetan zein datu mota da? denbora marka? "0" soberan dago, gertaerak txertatu eta editatu egin behar ditut. Eskerrik asko

  7.   Osteguna esan zuen

    SORTU DATU OINARRIA EZ BADAGO `bootstrap_calendar` / *! 40100 AURREZKO EZAUGARRI MULTZOA utf8 COLLATE utf8_spanish_ci * /;
    ERABILI `bootstrap_calendar`;
    - MySQL dump 10.13 Distrib 5.6.13, Win32rako (x86)
    -
    - Ostalaria: 127.0.0.1 Datu basea: bootstrap_calendar
    - ———————————————————
    - 5.5.27 zerbitzariaren bertsioa

    / *! 40101 SET @OLD_CHARACTER_SET_CLIENT = @@ CHARACTER_SET_CLIENT * /;
    / *! 40101 SET @OLD_CHARACTER_SET_RESULTS = @@ CHARACTER_SET_RESULTS * /;
    / *! 40101 SET @OLD_COLLATION_CONNECTION = @@ COLLATION_CONNECTION * /;
    / *! 40101 JARRI IZENAK utf8 * /;
    / *! 40103 SET @OLD_TIME_ZONE = @@ TIME_ZONE * /;
    / *! 40103 SET TIME_ZONE = '+ 00:00 ′ * /;
    / *! 40014 SET @OLD_UNIQUE_CHECKS = @@ UNIQUE_CHECKS, UNIQUE_CHECKS = 0 * /;
    / *! 40014 SET @OLD_FOREIGN_KEY_CHECKS = @@ FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS = 0 * /;
    / *! 40101 SET @OLD_SQL_MODE = @@ SQL_MODE, SQL_MODE = 'NO_AUTO_VALUE_ON_ZERO' * /;
    / *! 40111 SET @OLD_SQL_NOTES = @@ SQL_NOTES, SQL_NOTES = 0 * /;

    -
    - Taulako `gertaeren` egituraren taula
    -

    JARRAITU TAULA `gertaerak` BADAGO;
    / *! 40101 SET @saved_cs_client = @@ character_set_client * /;
    / *! 40101 SET character_set_client = utf8 * /;
    SORTU TAULA `gertaerak` (
    `id` int (10) sinatu gabea EZ NULL AUTO_INCREMENT,
    `title` varchar (150) COLLATE utf8_spanish_ci DEFAULT NULL,
    `body` text COLLATE utf8_spanish_ci NOT NULL,
    `url` varchar (150) COLLATE utf8_spanish_ci NOT NULL,
    `class` varchar (45) COLLATE utf8_spanish_ci NOT NULL DEFAULT 'info',
    `start` varchar (15) COLLATE utf8_spanish_ci NOT NULL,
    `end` varchar (15) COLLATE utf8_spanish_ci NOT NULL,
    LEHEN GAKOA ("id")
    ) MOTOREA = InnoDB DEFAULT CHARSET = utf8 COLLATE = utf8_spanish_ci;
    / *! 40101 SET character_set_client = @saved_cs_client * /;

    -
    - Taulako `gertaeren` datuak botatzea
    -

    LOCK TAULAK `gertaerak` IDATZI;
    / *! 40000 ALTER TABLE `events` DESACTIVE KEYS * /;
    / *! 40000 ALTER TABLE `events` ENABLE KEYS * /;
    DESBLOKALIZATU TAULAK;
    / *! 40103 SET TIME_ZONE = @ OLD_TIME_ZONE * /;

    / *! 40101 SET SQL_MODE = @ OLD_SQL_MODE * /;
    / *! 40014 SET FOREIGN_KEY_CHECKS = @ OLD_FOREIGN_KEY_CHECKS * /;
    / *! 40014 SET UNIQUE_CHECKS = @ OLD_UNIQUE_CHECKS * /;
    / *! 40101 SET CHARACTER_SET_CLIENT = @ OLD_CHARACTER_SET_CLIENT * /;
    / *! 40101 SET CHARACTER_SET_RESULTS = @ OLD_CHARACTER_SET_RESULTS * /;
    / *! 40101 SET COLLATION_CONNECTION = @ OLD_COLLATION_CONNECTION * /;
    / *! 40111 SET SQL_NOTES = @ OLD_SQL_NOTES * /;

    - 2014-05-31 14:38:23 amaitutako zabortegia

  8.   juan77 esan zuen

    kaixo migos ba al dago modurik JSON data formatua aldatzeko

  9.   giselabra esan zuen

    Egutegia oso ona da, gertaera berri bat gehitzean hasieran zein amaieran lehenetsitako data ingeles formatuan dago soilik. Nola aldatu gaztelaniara? DD / MM / AAAA izango litzateke. Mila esker eta agur

  10.   Fabian esan zuen

    Kaixo, egutegia oso ona da, baina data eguneratzean egutegian ez da berehala islatzen. Zer egin dezaket?

    Beste arazo bat ere badaukat, nola egin ditzaket puntu guztiak bistaratzeko hileko ikuspegian, posible da karratua handitzea? zer dagokio egun bati?

  11.   Alex esan zuen

    Adibidez kargatzean lokalean ezin hobeto funtzionatzen duen arazoa daukat, baina lineako zerbitzari batera igotzean ez dit ezer erakusten egutegitik botoiak soilik. Konpondu ahal izateko zerbitzariak zer izan dezakeen edo zer oker dagoen mesedez.