Jak za pomocą jquery przeniść wartość na pole tekstowe

pol90

2018-04-13T11:16:27+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Mam taki problem nie wiem jak prznieść wartość z diva na pole tekstowe typ text próbowałem takich sztuczek

Kopiuj

//alert("dobrze");
var d = $("#name").text();
//alert(d);
$("#pole_formularza").html(d);

i jeszcze

Kopiuj

$("#name").append($("#pole_formularza"));

reinman

2018-04-13T11:52:58+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 74

1

Chodzi ci o coś takiego?

Kopiuj

<div id="tmstatus">bla bla</div>    
<input id="textBoxId" name="tm_name" >   



<script type="text/javascript">
	var div_val = jQuery("#tmstatus").html();
	jQuery("input[name='tm_name']").val(div_val);
</script>

pol90

2018-04-13T12:18:05+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Udało się tylko musiałem jeszcze coś takiego dorobić

;```jquery
$("#name").hide()

Kopiuj

pol90

2018-04-13T13:33:56+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Teraz po zmianie na boostrap 4 nie chcę działać.

pol90

2018-04-13T14:20:08+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Jednak wszystko działa dobrze, a jak zrobić tak,żeby jak się najedzie na input to się w tym inpucie pokazywał ten tekst a jak się najedzie na pozostałą część to się ten input chowa w tym formie i tekst pokazuje się na górze.

jawlo

2018-04-13T16:12:47+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

Coś takiego?

Kopiuj

    <div style=" visibility: hidden;" id="tmstatus">bla bla</div>    
    <input id="textBoxId" name="tm_name" >   
 
    <script type="text/javascript">
        var div_val = jQuery("#tmstatus").html();
        jQuery("input[name='tm_name']")
            .mouseenter(function(){
                $(this).val(div_val);
            })
            .mouseleave(function(){
                $(this).hide();
                $("#tmstatus").css( "visibility", "visible");
            }); 
    </script>

pol90

2018-04-13T16:24:12+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Ale to w ogóle nie działa tak jak powinno.

jawlo

2018-04-13T16:36:47+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

pol90 napisał(a):

Jednak wszystko działa dobrze, a jak zrobić tak,żeby jak się najedzie na input to się w tym inpucie pokazywał ten tekst a jak się najedzie na pozostałą część to się ten input chowa w tym formie i tekst pokazuje się na górze.

Tutaj jest przykład działania tego kodu:
https://jsfiddle.net/jcumd7mo/3/

To jak to ma działać?

pol90

2018-04-13T17:05:15+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Ale tu chodzi o to, żby pole tekstowe nie znikało, a po na jechaniu na body ma się znowu znaleźć w polu tekstoym.

jawlo

2018-04-13T18:14:13+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

Czyli ma pojawiać się i znikać zawartość pola tekstowego?

Przykład

pol90

2018-04-13T18:21:54+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

jawlo napisał(a):

Czyli ma pojawiać się i znikać zawartość pola tekstowego?

Przykład

Tak a obraz pojawiać się na górze.

jawlo

2018-04-13T19:00:07+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

Obraz? znaczy się kopia?

https://jsfiddle.net/v9r0802r/2/

pol90

2018-04-13T19:13:49+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Wszystko dobrze tylko, że to nie chce działać u mnie na mojej maszynie.

jawlo

2018-04-13T19:16:27+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

Co to za maszyna? Jakie środowisko?

pol90

2018-04-13T19:18:42+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Debian 8.4 firefox 52

jawlo

2018-04-13T19:36:23+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

I jeszcze bootstrap...
Czyli problem leży w środowisku. W tym nie pomogę. Powodzenia

NitroCrash

2018-04-13T19:57:43+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 19

0

A co ci konsola wyświetla? Jak błąd?

pol90

2018-04-13T19:59:16+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

1

NitroCrash napisał(a):

A co ci konsola wyświetla? Jak błąd?

http://127.0.0.1/81/formularz/bootstrap-3/css/bootstrap-theme.min.css

pol90

2018-04-13T20:08:51+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Taki załącznik

pol90

2018-04-13T20:32:51+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

A jak w ogóle powinien być podłączony boostrap 4 bo mi taką ilość błędów wyrzuca, a ja ma tak go załadowane

Kopiuj

<link rel="stylesheet" href="./bootstrap4/css/bootstrap.min.css">

<script src="./bootstrap4/js/bootstrap.min.js"></script>

NitroCrash

2018-04-13T20:40:39+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 19

0

Modyfikowałeś ten plik ? Może z cdna skorzystaj :
Najpierw ładujesz jquery i popper:

Kopiuj


<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>

Później ładujesz bootstrapa

Kopiuj

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>

Dodatkowo wysyłam Ci odnośnik do oficjalnej strony :
https://getbootstrap.com/docs/4.1/getting-started/download/

pol90

2018-04-13T21:50:24+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

NitroCrash napisał(a):

Modyfikowałeś ten plik ? Może z cdna skorzystaj :
Najpierw ładujesz jquery i popper:
Kopiuj
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>
Później ładujesz bootstrapa
Kopiuj
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>
Dodatkowo wysyłam Ci odnośnik do oficjalnej strony :
https://getbootstrap.com/docs/4.1/getting-started/download/
Też nie działa, a najlepsze jest to, że jak usunąłem definicje bootstrapa to tez nie działało, a przecież ten skrypt nie korzysta z bootstrapa.

pol90

2018-04-13T21:58:17+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

Kopiuj

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>



    <script type="text/javascript">
    //alert("dobrze");
var div_val = jQuery("#tmstatus").html();
jQuery("input[name='tm_name']")
	.mouseenter(function(){
    $(this).val(div_val); 
    $("#tmstatus").css( "visibility", "hidden");
  })
  .mouseleave(function(){
    $(this).val("");
    $("#tmstatus").css( "visibility", "visible");
  });
    </script>
<link rel="stylesheet" href="style.css" type="text/css" />
   <div class="container-fluid">
    <div class="row">
      <div class="col-md-3 col-xs-3">
     <div style=" visibility: hidden;" id="tmstatus">bla bla</div>   
	<input id="textBoxId" name="tm_name" class="form-control" >    
	<hr class=hr>
      </div>
      <div class="col-md-3 col-xs-3">
      asdasd
	<input type=text name=dd class=form-control>
	<hr class=hr>
      </div>
     </div>
    </div>

NitroCrash

2018-04-13T22:06:15+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 19

1

Kopiuj

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
    crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
    crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4"
    crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm"
    crossorigin="anonymous"></script>
<link rel="stylesheet" href="style.css" type="text/css" />


<div class="container-fluid">
    <div class="row">
        <div class="col-md-3 col-xs-3">
            <div style=" visibility: hidden;" id="tmstatus">bla bla</div>
            <input id="textBoxId" name="tm_name" class="form-control">
            <hr class=hr>
        </div>
        <div class="col-md-3 col-xs-3">
            asdasd
            <input type=text name=dd class=form-control>
            <hr class=hr>
        </div>
    </div>
</div>
<script type="text/javascript">
    var div_val = jQuery("#tmstatus").html();
    jQuery("input[name='tm_name']")
        .mouseenter(function () {
            $(this).val(div_val);
            $("#tmstatus").css("visibility", "hidden");
        })
        .mouseleave(function () {
            $(this).val("");
            $("#tmstatus").css("visibility", "visible");
        });
</script>

Na końcu daje się skrypty bo się dom nie załadował.

pol90

2018-04-14T18:31:01+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 1181

0

A ja bym chciał jeszcze, żeby się dało wpisać jakiś text bo ciągle się wpisuje to bla bla i próbowałem czegoś takiego, ale to nie do końca działa

Kopiuj

    var div_val = jQuery("#tmstatus").html();
    alert("dobrze");
    
    jQuery("input[name='tm_name']")
    
        .mouseenter(function () {
        if (($("#tmstatus").text() == "") || ($("#tmstatus").text() == "bla bla")) {
            $(this).val(div_val);
            $("#tmstatus").css("visibility", "hidden");
            }
        })
        .mouseleave(function () {
        if (($("#tmstatus").text() == "") || ($("#tmstatus").text() == "bla bla")) {
            $(this).val("");
            $("#tmstatus").css("visibility", "visible");
            }
            
        });

I chciałbym, żeby to kliknięciem a nie opuszczeniem myszki się dało zrobić.

jawlo

2018-04-14T19:36:29+02:00

Rejestracja: dni
Ostatnio: dni
Postów: 134

0

Jak klikniesz to aktywujesz pole i możesz w nim pisać.
Jeżeli chcesz aby zawartość pola była przeniesiona to zobacz ten przykład:
https://jsfiddle.net/fahgd16e/2/