firma şube

by gurkavcu

HTML

<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>
<script src="https://raw.github.com/ivaynberg/select2/master/select2.js"></script>
<script src="https://raw.github.com/ericmbarnard/Knockout-Validation/master/Src/knockout.validation.js"></script>
<select  data-bind="options:firmaListesi, optionsText: 'unvan', value: selectedFirma, selecttwojs :{}"></select>

<div class="well well-small contComp">
    <address>
      <strong data-bind="text: selectedFirma().unvan()"></strong><br />
      <!-- ko if: selectedFirma().id() > 0 -->
      <span data-bind="text:  selectedFirma().adres()[0].adres"></span><br />
      <!-- /ko -->
      <!-- ko if: selectedFirma().telefon().length > 0 -->
        <!-- ko foreach: selectedFirma().telefon() -->
        <abbr data-bind="if:telefonTip =='IS' || telefon=='EV'">T:</abbr>
        <abbr data-bind="if:telefonTip =='MOBIL'">M:</abbr>
        <abbr data-bind="if:telefonTip =='FAX'">F:</abbr>
        &nbsp;<span data-bind="text: telefon"></span><br />
        <!-- /ko -->
      <!-- /ko -->
    </address>
     
    <address>
      <!-- ko if: selectedFirma().webAdres().length > 0 -->
      <a data-bind="attr: { href: selectedFirma().webAdres()[0].adres}, text: selectedFirma().webAdres()[0].adres"></a><br>
      <!-- /ko -->
      <!-- ko if: selectedFirma().ePosta().length > 0 -->
        <a data-bind="attr: { href: 'mailto:' + selectedFirma().ePosta()[0].adres}, text: selectedFirma().ePosta()[0].adres"></a><br />
      <!-- /ko -->
    </address>
</div>

CSS

/*
Version: @@ver@@ Timestamp: @@timestamp@@
*/
.select2-container {
    position: relative;
    display: inline-block;
    /* inline-block for ie7 */
    zoom: 1;
    *display: inline;
    vertical-align: top;
}

.select2-container,
.select2-drop,
.select2-search,
.select2-search input{
  /*
    Force border-box so that % widths fit the parent
    container without overlap because of margin/padding.

    More Info : http://www.quirksmode.org/css/box.html
  */
  -moz-box-sizing: border-box;    /* firefox */
  -ms-box-sizing: border-box;     /* ie */
  -webkit-box-sizing: border-box; /* webkit */
  -khtml-box-sizing: border-box;  /* konqueror */
  box-sizing: border-box;         /* css3 */
}

.select2-container .select2-choice {
    background-color: #fff;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(0.5, white));
    background-image: -webkit-linear-gradient(center bottom, #eeeeee 0%, white 50%);
    background-image: -moz-linear-gradient(center bottom, #eeeeee 0%, white 50%);
    background-image: -o-linear-gradient(bottom, #eeeeee 0%, #ffffff 50%);
    background-image: -ms-linear-gradient(top, #eeeeee 0%, #ffffff 50%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#eeeeee', endColorstr = '#ffffff', GradientType = 0);
    background-image: linear-gradient(top, #eeeeee 0%, #ffffff 50%);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #aaa;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    height: 26px;
    line-height: 26px;
    padding: 0 0 0 8px;
    color: #444;
    text-decoration: none;
}

.select2-container.select2-drop-above .select2-choice
{
    border-bottom-color: #aaa;
    -webkit-border-radius:0px 0px 4px 4px;
    -moz-border-radius:0px 0px 4px 4px;
   ...

JavaScript

var firmaJson = JSON.parse('[{\"adres\":[{\"ilIlceSemt\":null,\"adresTip\":\"FATURA\",\"adres\":\"Konya yolu 208 Balgat\",\"postaKod\":null,\"id\":2,\"version\":0}],\"telefon\":[{\"telefonTip\":\"FAX\",\"telefon\":\"3122840000\",\"id\":7,\"version\":0},{\"telefonTip\":\"IS\",\"telefon\":\"3122845252\",\"id\":5,\"version\":0}],\"ePosta\":[{\"adres\":\"[email protected]\",\"ePostaTip\":null,\"aciklama\":null,\"id\":3,\"version\":0},{\"adres\":\"[email protected]\",\"ePostaTip\":null,\"aciklama\":null,\"id\":4,\"version\":0}],\"webAdres\":[],\"unvan\":\"NEZIROGLU\",\"vergiNo\":\"\",\"vergiDaire\":\"\",\"aciklama\":\"\",\"firma\":1,\"eklendi\":\"Oct 13, 2012 10:51:30 AM\",\"ekleyen\":-1,\"degisti\":null,\"degistiren\":0,\"id\":1,\"version\":0},{\"adres\":[{\"ilIlceSemt\":null,\"adresTip\":\"FATURA\",\"adres\":\"oras\u0131 buras\u0131\",\"postaKod\":null,\"id\":3,\"version\":0}],\"telefon\":[{\"telefonTip\":\"IS\",\"telefon\":\"3122845050\",\"id\":6,\"version\":0}],\"ePosta\":[{\"adres\":\"[email protected]\",\"ePostaTip\":null,\"aciklama\":null,\"id\":5,\"version\":0}],\"webAdres\":[{\"adres\":\"http:\/\/www.google.com\",\"webAdresTip\":\"IS\",\"aciklama\":null,\"id\":1,\"version\":0}],\"unvan\":\"RENAULT\",\"vergiNo\":\"\",\"vergiDaire\":\"\",\"aciklama\":\"\",\"firma\":1,\"eklendi\":\"Oct 13, 2012 12:45:05 PM\",\"ekleyen\":-1,\"degisti\":\"Oct 13, 2012 12:45:05 PM\",\"degistiren\":0,\"id\":2,\"version\":0}]');

//MODELLER

//Firma model oluşturuyoruz
var FirmaModel = function(id, adres, telefon, ePosta, webAdres, unvan, vergiNo, vergiDaire, aciklama){
    var self = this;
    
    self.id = ko.observable(id).extend({validatable:false});
    self.adres = ko.observableArray(adres).extend({validatable:false});
    self.telefon = ko.observableArray(telefon).extend({validatable:false});
    self.ePosta = ko.observableArray(ePosta).extend({validatable:false});
    self.webAdres = ko.observableArray(webAdres).extend({validatable:false});
    self.unvan =...