Wie zu set Breite der textbox sein wie in MaxLength ASP.NET

Gibt es eine Möglichkeit, ich kann begrenzen Sie die Breite der textbox gleich der MaxLength-Eigenschaft? In meinem Fall jetzt, das textbox-Steuerelement wird in eine Tabellenzelle eingefügt, wie in diesem snippet:

<td class=TDSmallerBold style="width:90%">
        <asp:textbox id="txtTitle" runat="server"
            CausesValidation="true"
            Text="Type a title here..be concise but descriptive. Include price."
            ToolTip="Describe the item with a short pithy title (most important keywords first). Include the price. The title you provide here will be the primary text found by search engines that index Zipeee content." 
            MaxLength="60"
            Width="100%">
        </asp:textbox>

(Ich weiß, ich sollte nicht verwenden Sie HTML-Tabellen zu layout-Steuerung..ein anderes Thema, sicher), aber gibt es eine Möglichkeit zum begrenzen der tatsächlichen Breite auf die maximale Anzahl der zulässigen Zeichen in der box eingegeben?

InformationsquelleAutor John Adams | 2010-06-10

  1. 3

    Es wird nicht präzise sein, da Zeichen kann variieren in der Breite. Aber wenn Sie es wirklich ernst, Sie könnte es mit ein wenig Javascript (jQuery). Die Schritte wären:

    • Erstellen Sie eine span-offscreen (top:-1000px oder so)
    • Stellen Sie sicher, dass der span hat die gleichen Stile/Klassen, wie Sie Ihren text-box
    • Füllen Sie den span mit 60 Zeichen
    • JQuery verwenden, Messen Sie die Breite der Spanne
    • Gelten, dass die Breite der text-box

    Es ist eine Technik ähnlich dem auto-expandierende Texteingabefelder, die Sie sehen, auf Facebook und so: http://james.padolsey.com/javascript/jquery-plugin-autoresize/

    (In diesem Fall, Sie tun es horizontal statt vertikal.)

    Wenn Sie brauchen, echten code, lassen Sie es mich wissen, ich werde mein bestes tun.

    InformationsquelleAutor Matt Sherman

  2. 3

    Konnten Sie es aus dem code (in Ihrem Namen Page_Load) als solche:

     txtTitle.Width = new Unit(txtTitle.MaxLength, UnitType.Em);

    Unser system ist Datenbank-getrieben und wir haben ein meta-Daten-Tabelle, die speichert eine length-Eigenschaft für jede variable. Ich persönlich benutzt den meta-Daten, die von der Iteration über die ControlCollection und für jedes TextBox-Element, ziehen Sie die Länge der variable in der meta-Daten und dann die Zuordnung zu MaxLength und Breite, aber wenn Sie bereits haben MaxLength setzen, könnten Sie es tun, Breiten sich in dieser Weise.

    InformationsquelleAutor Robert

  3. 0

    Verwende ich die HTML-Eigenschaft cols

    Also für dein Beispiel würde ich 

         <td class=TDSmallerBold style="width:90%">
    <asp:textbox id="txtTitle" runat="server"
        CausesValidation="true"
        Text="Type a title here..be concise but descriptive. Include price."
         ToolTip="Blah Blah I don't like horizotal scroll-bars" 
        MaxLength="60"
        Width="100%"
         Cols="60" 
      >
    </asp:textbox>

    Habe ich nie ausprobiert, aber ich Frage mich, ob es einen Weg gibt, zu verbinden. Also Einstellung MaxLength legt auch zu Spalten, wäre eine interessante übung

    InformationsquelleAutor ggonsalv

  4. 0

    Mir ist klar, dass dies ist eine alte Frage, aber für diejenigen, die über Sie kommen auf der Suche für how to style text-Boxen basierend auf dem MaxLength-Attribut verwende ich folgende CSS:

    input[maxlength='2'] { width: 40px;}

    Wenn Sie viele text-Boxen mit verschiedenen MaxLengths, dann dies ist wahrscheinlich nicht gehen, um die Lösung für Sie. Allerdings, wenn Sie wollen, dass die Präsentation ein Textfeld zu entsprechen, was ist auf die Eingabe in es, ich denke, es ist eine gute Lösung.

    InformationsquelleAutor Gareth

  5. 0
    $(':input[maxlength]').each(function (i, e) {$(e).width(e.maxLength * 10)});

    Dies ist so eine Vermutung, die Charaktere sind etwa 10px. Es funktioniert sehr gut für meine Bedürfnisse.

    InformationsquelleAutor Michael K

  6. 0

    Merke ich, das ist ein sehr Alter post, hier ist meine Antwort für zukünftige Referenz für die anderen!

    Verwenden Sie die Style-Eigenschaft width auf 100% statt width-Eigenschaft auf seine eigene.

    z.B.

    <td class=TDSmallerBold style="width:90%">
<asp:textbox id="txtTitle" runat="server"
    CausesValidation="true"
    Text="Type a title here..be concise but descriptive. Include price."
    ToolTip="Blah Blah I don't like horizontal scroll-bars" 
    MaxLength="60"
    Style="Width: 100%"
  >
</asp:textbox>

    Diese ist erprobt und getestet in einer Produktions-Umgebung, die ich arbeiten. Es ist einfacher als mit Javascript und funktioniert in bestehenden HTML.

    Genau, warum das funktioniert, leider bin ich kurz wissen.

    InformationsquelleAutor sequel.world

Schreibe einen Kommentar