PHP - Todo los input en el mismo renglon

 
Vista:
sin imagen de perfil
Val: 37
Ha aumentado su posición en 3 puestos en PHP (en relación al último mes)
Gráfica de PHP

Todo los input en el mismo renglon

Publicado por Javier Gonzalez (24 intervenciones) el 15/01/2018 20:00:21
Buenas Tardes a Todos :

Tengo este código que baje de un WEB y lo probé y funciono
le agregue unos campos y también funciona, pero quiero que aparezca el SELECT en el mismo renglón pero no he podido hacerlo, lo hice con <div> pero no me respeta que ejecute el icono para borrar el renglón.

Si no es mucho pedir que le echen un ojo a esto, se los agradeceré.

Saludos
JAG

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html lang="pt-BR">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1"/>
		<title>Adicionando Campo Dinâmico</title>
		<script src="js/jquery-3.2.1.min.js"></script>
		<link rel="stylesheet" href="css/bootstrap.min.css">
		<script src="js/bootstrap.min.js"></script>
	</head>
	<body>
		<div class="container">
		    <br>
		    	<div class="form-group">
					<label for="nombre" class="col-sm-2 control-label">Nombre :</label>
					<div class="col-sm-4">
						<input type="text" maxlength="20" class="form-control  input-sm" id="nombre" name="nombre" placeholder="Nombre Completo" required>
				</div>
				</div>
				<br>
				<div class="form-group">
					<label for="dirnumero" class="col-sm-2 control-label">Direccion :</label>
					<div class="col-sm-3">
						<input type="text" maxlength="60" class="form-control  input-sm" id="dirreccion" name="direccion" placeholder="Direccion" required>
			     	</div>
 
					<label for="dirnumeroint" class="col-sm-2 control-label">Numero :</label>
					<div class="col-sm-2">
						<input type="text" maxlength="10" class="form-control  input-sm" id="dirnumero" name="dirnumero" placeholder="Numero" required>
				    </div>
				</div>
		    <br>
		    <div>
			<a class="btn btn-primary btn-xs" href="javascript:void(0)" id="addInput">
				<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Agregar Campo
			</a>
			</div>
			<br>
 
			<div class="container" id="dynamicDiv">
				<p>
			        <input type="text" id="inputeste" size="20" value="" placeholder="" />
			        <input type="text" id="inputeste" size="20" value="" placeholder="" />
		            <select  class="form-control input-sm" style="width:300px"  id="subespecialidad" name="subespecialidad">
			                <option> opcion1</option>
			                <option> opcion2</option>
			                <option> opcion3</option>
                	</select>
			        <a class="btn btn-danger btn-xs" href="javascript:void(0)" id="remInput">
			        	<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
			        </a>
		        </p>
		    </div>
 
			<script>
			$(function () {
			    var scntDiv = $('#dynamicDiv');
			    $(document).on('click', '#addInput', function () {
			        $('<p>'+
		        		'<input type="text" id="inputeste" size="20" value="" placeholder="" /> '+
		        		'<input type="text" id="inputeste" size="20" value="" placeholder="" /> '+
		                '<select  class="form-control input-sm" style="width:300px" id="subespecialidad" name="subespecialidad">'+
			                '<option> opcion1</option>'+
			                '<option> opcion2</option>'+
			                '<option> opcion3</option>'+
                		'</select>'+
		        		'<a class="btn btn-danger btn-xs" href="javascript:void(0)" id="remInput">'+
							'<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> ' +
		        		'</a>'+
					'</p>').appendTo(scntDiv);
			        return false;
			    });
			    $(document).on('click', '#remInput', function () {
		            $(this).parents('p').remove();
			        return false;
			    });
			});
			</script>
		</div>
	</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil
Val: 729
Bronce
Ha aumentado 1 puesto en PHP (en relación al último mes)
Gráfica de PHP

Todo los input en el mismo renglon

Publicado por gonzalo (615 intervenciones) el 15/01/2018 21:28:53
en un div no se como se hace, pero un un Table solo agregas un NoWrap al td que los contiene y te respeta los objetos en una sola linea, intentalo con el div, tal vez lo acepte.

salu2
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 14
Ha aumentado su posición en 14 puestos en PHP (en relación al último mes)
Gráfica de PHP

Todo los input en el mismo renglon

Publicado por David (9 intervenciones) el 15/01/2018 21:38:39
Hola, priemro creo que esto deberia ir en el foro de HTML y no aqui en el de php, segundo, no te entendi bien pero supongo es esto lo que querias:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
 
<html lang="pt-BR">
 
<head>
 
    <meta charset="UTF-8">
 
    <meta name="viewport" content="width=device-width, initial-scale=1" />
 
    <title>Adicionando Campo Dinâmico</title>
 
    <script src="js/jquery-3.2.1.min.js"></script>
 
    <link rel="stylesheet" href="css/bootstrap.min.css">
 
    <script src="js/bootstrap.min.js"></script>
 
</head>
 
<body>
 
    <div class="container">
 
 
 
        <div class="form-group">
 
            <label for="nombre" class="col-sm-2 control-label">Nombre :
                <input type="text" maxlength="20" class="form-control  input-sm" id="nombre" name="nombre" placeholder="Nombre Completo" required>
            </label>
 
            <label for="dirnumero" class="col-sm-2 control-label">Direccion :
                <input type="text" maxlength="60" class="form-control  input-sm" id="dirreccion" name="direccion" placeholder="Direccion" required>
            </label>
 
            <label for="dirnumeroint" class="col-sm-2 control-label">Numero :
                <input type="text" maxlength="10" class="form-control  input-sm" id="dirnumero" name="dirnumero" placeholder="Numero" required>
            </label>
 
        </div>
        <br>
        <div>
 
            <a class="btn btn-primary btn-xs" href="javascript:void(0)" id="addInput">
 
				<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Agregar Campo
 
			</a>
 
        </div>
        <br>
 
        <div class="container" id="dynamicDiv">
 
            <p>
 
                <input type="text" id="inputeste" size="20" value="" placeholder="" />
 
                <input type="text" id="inputeste" size="20" value="" placeholder="" />
 
                <select class="form-control input-sm" style="width:300px" id="subespecialidad" name="subespecialidad">
 
			                <option> opcion1</option>
 
			                <option> opcion2</option>
 
			                <option> opcion3</option>
 
                	</select>
 
                <a class="btn btn-danger btn-xs" href="javascript:void(0)" id="remInput">
 
			        	<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
 
			        </a>
 
            </p>
 
        </div>
 
 
 
        <script>
            $(function() {
 
                var scntDiv = $('#dynamicDiv');
 
                $(document).on('click', '#addInput', function() {
 
                    $('<p>' +
 
                        '<input type="text" id="inputeste" size="20" value="" placeholder="" /> ' +
 
                        '<input type="text" id="inputeste" size="20" value="" placeholder="" /> ' +
 
                        '<select  class="form-control input-sm" style="width:300px" id="subespecialidad" name="subespecialidad">' +
 
                        '<option> opcion1</option>' +
 
                        '<option> opcion2</option>' +
 
                        '<option> opcion3</option>' +
 
                        '</select>' +
 
                        '<a class="btn btn-danger btn-xs" href="javascript:void(0)" id="remInput">' +
 
                        '<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> ' +
 
                        '</a>' +
 
                        '</p>').appendTo(scntDiv);
 
                    return false;
 
                });
 
                $(document).on('click', '#remInput', function() {
 
                    $(this).parents('p').remove();
 
                    return false;
 
                });
 
            });
 
        </script>
 
    </div>
 
</body>
 
</html>
si es porfa avisame, lo que hice fue agregar los inputs dentro del label.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 37
Ha aumentado su posición en 3 puestos en PHP (en relación al último mes)
Gráfica de PHP

Todo los input en el mismo renglon

Publicado por Javier Gonzalez (24 intervenciones) el 16/01/2018 00:13:59
Gracias David por la respuesta pero en realidad lo que estoy tratando de alinear es el segundo grupo de inputs cuando das opcion agregar campo aparecen tres nuevos input dos TEXT y un SELECT pero el select aparece abajo y lo quiero a la derecha de los TEXT.
Saludos

Hola Gonzalo tambien gracias a ti, en realidad he probado algunas opciones y no se tu opcion, al preguntar aqui es porque ya trate varias opciones y no tengo los resultados esperados.

Saludos a ambos.
JAG
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 729
Bronce
Ha aumentado 1 puesto en PHP (en relación al último mes)
Gráfica de PHP

Todo los input en el mismo renglon

Publicado por gonzalo (615 intervenciones) el 16/01/2018 00:38:39
no es complicado con las tablas.

1
2
3
4
5
6
7
<table>
<tr>
<td nowrap>
text label checkbox option box etc
</td>
</tr>
</table>

el uso de nowrap en una tabla evita que una linea se divida cuando el td no tiene espacio para mostrar todo.

en el caso de los divs no se si funcione

1
2
3
<div id='DivEjemplo' nowrap>
text label checkbox option box etc
</div>

intentalo y nos avisas.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar